• iOS开发UI篇—Button基础

    一、简单说明

    一般情况下,点击某个控件后,会做出相应反应的都是按钮

    按钮的功能比较多,既能显示文字,又能显示图片,还能随时调整内部图片和文字的位置

    二、按钮的三种状态

    normal(普通状态)

    默认情况(Default)

    对应的枚举常量:UIControlStateNormal

    highlighted(高亮状态)

    按钮被按下去的时候(手指还未松开)

    对应的枚举常量:UIControlStateHighlighted

    disabled(失效状态,不可用状态)

    如果enabled属性为NO,就是处于disable状态,代表按钮不可以被点击

    对应的枚举常量:UIControlStateDisabled

    三、注意点

    (1)从Xcode5开始,图片资源都放到Images.xcassets中进行管理,可以使用拖拽的方式添加项目中用到的图片到Images.xcassets中

    (2)若干多个控件共用一段代码,通常使用tag。

    四、代码示例

    (1)

     1 #import "LFViewController.h"
     2
     3 @interface LFViewController ()
     4
     5 @property (weak, nonatomic) IBOutlet UIButton *headImageView;
     6
     7 @end
     8
     9 @implementation LFViewController
    10
    11 // 在OC中,绝大多数的控件的监听方法的第一个参数就是控件本身
    12 //- (IBAction)left:(UIButton *)button {
    13 //
    14 //    NSLog(@"----");
    15 //}
    16 - (IBAction)move
    17 {
    18     // 通过frame修改head的位置
    19     // 在OC中,不允许直接修改“对象”的“结构体属性”的“成员”
    20     // 允许修改“对象”的“结构体属性”
    21     // 1. 取出结构体属性
    22     CGRect rect = self.headImageView.frame;
    23     // 2. 修改结构体成员
    24     rect.origin.y -= 20;
    25     // 3. 设置对象的结构体属性
    26     self.headImageView.frame = rect;
    27 }
    

    (2)

     1 #import "LFViewController.h"
     2
     3 /**
     4  使用git
     5
     6  1. 创建项目时,勾选git
     7  2. 开发告一段落后,选择"Source Control""Commit",并编写注释
     8  */
     9
    10
    11 // 枚举类型实质上就是一个整数,作用就是用来替代魔法数字
    12 // 枚举类型中,指定了第一个整数之后,后面的数字会递增
    13 typedef enum
    14 {
    15     kMovingDirTop = 10,
    16     kMovingDirBottom,
    17     kMovingDirLeft,
    18     kMovingDirRight,
    19 } kMovingDir;
    20
    21 #define kMovingDelta 50
    22
    23 @interface LFViewController ()
    24
    25 @property (weak, nonatomic) IBOutlet UIButton *headImageView;
    26
    27 @end
    28
    29 @implementation LFViewController
    30
    31 - (IBAction)move:(UIButton *)button
    32 {
    33 //    CGRect rect = self.headImageView.frame;
    34     CGPoint p = self.headImageView.center;
    35
    36     // magic number魔法数字,其他程序员看到代码的时候,不知道是什么意思
    37     switch (button.tag) {
    38         case kMovingDirTop:
    39             p.y -= kMovingDelta;
    40             break;
    41         case kMovingDirBottom:
    42             p.y += kMovingDelta;
    43             break;
    44         case kMovingDirLeft:
    45             p.x -= kMovingDelta;
    46             break;
    47         case kMovingDirRight:
    48             p.x += kMovingDelta;
    49             break;
    50     }
    51
    52     [UIView beginAnimations:nil context:nil];
    53     [UIView setAnimationDuration:1.0];
    54
    55     self.headImageView.center = p;
    56
    57     [UIView commitAnimations];
    58 }
    59
    60 - (IBAction)zoom:(UIButton *)button
    61 {
    62     CGRect rect = self.headImageView.bounds;
    63
    64     // 在C语言中,关于bool的判断:非零即真
    65     if (button.tag) {
    66         rect.size.width += 50;
    67         rect.size.height += 50;
    68     } else {
    69         rect.size.width -= 50;
    70         rect.size.height -= 50;
    71     }
    72
    73     // 首尾动画
    74     // beginAnimations表示此后的代码要“参与到”动画中
    75     [UIView beginAnimations:nil context:nil];
    76     [UIView setAnimationDuration:2.0];
    77
    78     self.headImageView.bounds = rect;
    79 //    self.headImageView.alpha = 0;
    80
    81     // commitAnimations,将beginAnimation之后的所有动画提交并生成动画
    82     [UIView commitAnimations];
    83 }
    84
    85 @end
    

    五、补充笔记

    1. IBAction的参数

    - (IBAction)left:(UIButton *)button

    (1) 在OC中,绝大多数的控件监听方法的第一个参数就是控件本身

    (2) 默认连线时的参数类型是id

    (3) 如果要在监听方法中,方便控件的使用,可以在连线时或者连线后,修改监听方法的参数类型

    2. 修改对象的结构体成员

    在OC中,不允许直接修改“对象”的“结构体属性”的“成员”,但是允许修改“对象”的“结构体属性”

    修改结构体属性的成员方法如下:

    (1)使用临时变量记录对象的结构体属性

    (2) 修改临时变量的属性

    (3)将临时变量重新设置给对象的结构体属性

    3. 在程序开发中需要避免出现魔法数字(Magic Number)

    使用枚举类型,可以避免在程序中出现魔法数字

    (1)枚举类型实质上就是一个整数,其作用就是用来替代魔法数字

    (2)枚举类型中,指定了第一个整数之后,后面的数字会递增

    4. frame & bounds & center

    1> frame可以修改对象的位置和尺寸

    2> bounds可以修改对象的尺寸

    3> center可以修改对象的位置

    5. 首尾式动画

    // beginAnimations表示此后的代码要“参与到”动画中

    [UIView beginAnimations:nil context:nil];

    // setAnimationDuration用来指定动画持续时间

    [UIView setAnimationDuration:2.0];

    self.headImageView.bounds = rect;

    ......

    // commitAnimations,将beginAnimation之后的所有动画提交并生成动画

    [UIView commitAnimations];

     
     
  • UIUtton 常见属性
  • UIButton *button4 = [UIButton buttonWithType:UIButtonTypeCustom];
       
        button4.frame = CGRectMake(50, 250, 100, 50);

    button4.backgroundColor = [UIColor cyanColor];
       
        // 自定义类型, 文字默认是白色;
        [button4 setTitle:@"自定义类型" forState:UIControlStateNormal];
        // 设置高亮状态下的文字:
        [button4 setTitle:@"高亮状态" forState:UIControlStateHighlighted];
        // 设置高亮状态下文字的颜色:
        [button4 setTitleColor:[UIColor blackColor] forState:UIControlStateHighlighted];
       
        // 添加目标事件:
        // 当第四个button的touchUpInside事件响应时,会调用clickBtn:方法
        [button4 addTarget:self action:@selector(clickBtn:) forControlEvents:UIControlEventTouchUpInside];
        // button4有添加了一个响应事件
        [button4 addTarget:self action:@selector(clickBtn4:) forControlEvents:UIControlEventTouchDragOutside];
       
        //  设置弧度:
        button4.layer.cornerRadius = 15.0;
        // 边框的宽度:
        button4.layer.borderWidth = 5.0;
        // 边框的颜色:(ps: color的类型需要转成CGColor)
        button4.layer.borderColor = [[UIColor blackColor] CGColor];
       
        [self.window addSubview:button4];

    //参数1: 定时器的秒数  参数2:目标对象  参数3 :响应的方法 参数4  nil   参数5 YES 重复调用/NO 只是调用一次
    [NSTimer scheduledTimerWithTimeInterval:1.0 target:self selector:@selector(updateTimer:) userInfo:nil repeats:YES];
  • //    UIControlStateNormal       = 0,
  • //    UIControlStateHighlighted  = 1 << 0,                  // used when UIControl
  • //    UIControlStateDisabled     = 1 << 1,
  • //    UIControlStateSelected     = 1 << 2,
  • [btn3 setBackgroundImage:[UIImage imageNamed:@"MC_Checkbox_Unchecked"] forState:UIControlStateNormal];
        [btn3 setBackgroundImage:[UIImage imageNamed:@"MC_checkbox_Checked"] forState:UIControlStateSelected];
        // selected 属性切换选择状态的属性,如果selected = YES 是选择状态, 如果selected =NO 是正常状态
  • // control 可以让你的控件接收系统提供事件
        UIControl *control = [[UIControl alloc]initWithFrame:CGRectMake(0, 20, 100, 100)];
        control.backgroundColor  = [UIColor greenColor];
  • //   addTarget: 添加目标和事件
        // 参数一;目标对象
        // 参数二:响应的方法
        // 参数三监听事件
  • [control addTarget:self action:@selector(clickControl:) forControlEvents:UIControlEventTouchUpInside];
        [self.window addSubview:control];
  • //    UIControlEventTouchDown           = 1 <<  0, 按下时响应
  • //    UIControlEventTouchDownRepeat     = 1 <<  1,
  • //    UIControlEventTouchDragInside     = 1 <<  2, 按下在里面松手响应
  • //    UIControlEventTouchDragOutside    = 1 <<  3,
  • //    UIControlEventTouchDragEnter      = 1 <<  4,
  • //    UIControlEventTouchDragExit       = 1 <<  5,
  • //    UIControlEventTouchUpInside       = 1 <<  6,
  • //    UIControlEventTouchUpOutside      = 1 <<  7,
  • //    UIControlEventTouchCancel         = 1 <<  8,
 
   图片名称的后缀名是png的,可以省略,其他后缀名不能省略
 UIImage *image = [UIImage imageNamed:@"1.png"];
 设置button 的图片;
 如果图片的尺寸比button 的尺寸小, 图片一原来的尺寸显示
 如果图片的尺寸比button 的尺寸大, 图片以button 的尺寸显示
 btn3 setImage:image forState:UIControlStateNormal];
 设置button 的背景图片
 不管图片的比button 的大还是小,图片都是以button 的尺寸显示;
 [btn3 setBackgroundImage:image forState:UIControlStateNormal];
 UIControlStateSelected

UI Button的更多相关文章

  1. Unity5UGUI 官方教程学习笔记(三)UI BUTTON

    Button Interactable :为了避免与该按钮产生交互,可以设置它为false Transition: 管理按钮在正常情况 ,按下,经过时的显示状态  None  按钮整正常工作 但是在按 ...

  2. Unity UI on the HoloLens

    Following the steps under "Required configuration" will allow Unity UI to continue to work ...

  3. 集成 Kendo UI for Angular 2 控件

    伴随着 Angular 2 的正式 release,Kendo UI for Angular 2 的第一批控件已经发布了,当前是 Beta 版本,免费使用. 官方站点:Kendo UI for Ang ...

  4. 关于UI系统的问题

    function OnGUI(){ GUI.skin = myskin; if(GUILayout.Button("add_component",GUILayout.Height( ...

  5. cocos2dx 3.x(定时器或延时动作自动调用button的点击响应事件)实现自动内测

    // // ATTGamePoker.hpp // MalaGame // // Created by work on 2016/11/09. // // #ifndef ATTGamePoker_h ...

  6. cocos2dx 3.x(多个按钮button执行同一事件的区分)

    // // ATTGamePoker.hpp // MalaGame // // Created by work on 2016/10/18. // // #ifndef ATTGamePoker_h ...

  7. cocos2dx 3.x(Button传统按钮)

    // // ATTLoagingScene.hpp // ATT // // Created by work on 16/10/13. // // #ifndef ATTLoagingScene_hp ...

  8. 160908、前端开发框架Semantic UI

    简介 网页开发中,CSS控制网页样式.作为测试开发工程师,我个人不太擅长手写CSS.样式微调.兼容浏览器等工作,所以我选择使用成熟的前端框架,可以快速开发出样式美观的网站,也解决了大部分浏览器兼容问题 ...

  9. firefox 扩展开发笔记(三):高级ui交互编程

    firefox 扩展开发笔记(三):高级ui交互编程 前言 前两篇链接 1:firefox 扩展开发笔记(一):jpm 使用实践以及调试 2:firefox 扩展开发笔记(二):进阶开发之移动设备模拟 ...

随机推荐

  1. Kafka实战-Flume到Kafka

    1.概述 前面给大家介绍了整个Kafka项目的开发流程,今天给大家分享Kafka如何获取数据源,即Kafka生产数据.下面是今天要分享的目录: 数据来源 Flume到Kafka 数据源加载 预览 下面 ...

  2. Android Handler机制

    http://blog.csdn.net/erliangcode/article/details/52117831

  3. Python的第二天

    一.while循环语句 Python 编程中 while 语句用于循环执行程序,即在某条件下,循环执行某段程序,以处理需要重复处理的相同任务.其基本形式为: while 判断条件: 执行语句-- 执行 ...

  4. 为什么获取的System.Web.HttpContext.Current值为null,HttpContext对象为null时如何获取程序(站点)的根目录

    ASP.NET提供了静态属性System.Web.HttpContext.Current,因此获取HttpContext对象就非常方便了.也正是因为这个原因,所以我们经常能见到直接访问System.W ...

  5. Oracle 数据泵文件

    数据泵文件 expdp介绍 EXPDP命令行选项1. ATTACH该选项用于在客户会话与已存在导出作用之间建立关联.语法如下ATTACH=[schema_name.]job_nameSchema_na ...

  6. VUE应用的一些感受

    方便,数据绑定太方便了. 一个组件一个.vue文件特别清晰. 讲真vue比angular好学多了. webpack打包最近看懂,通过一个主文件把require的文件都打进来.业务代码放build里,引 ...

  7. BZOJ3236: [Ahoi2013]作业

    Description Input Output Sample Input 3 4 1 2 2 1 2 1 3 1 2 1 1 1 3 1 3 2 3 2 3 Sample Output 2 2 1 ...

  8. The Storage Situation: Removable Storage

    http://commonsware.com/blog/2014/04/09/storage-situation-removable-storage.html There is a lot of co ...

  9. 使用goldengate交付指定时间前的数据

    在数据同步过程中,客户担心在源端误操作,比如truncate, drop, delete all等,在目标端也会立即同步,而无法挽救损失:因此,客户希望是目标端的数据比源端要慢一个时间点. 解决方案: ...

  10. php中若干模块的安装

    1.php的mysql扩展pdo_mysql(在php源码所在目录) 1.1 进入 PHP 的软件包 pdo 扩展目录中   cd /usr/local/services/php-5.6.5/ext/ ...