zoukankan      html  css  js  c++  java
  • 从零开始学ios开发(六):IOS控件(3),Segmented Control、Switch

    这次的学习还是基于上一个项目继续进行(你也可以新建一个项目)学习Segmented Control和Switch。

    Segmented Control

    Switch

    Segmented Control和Switch的主要区别在于Segmented Control可以有多个值进行选择,而Switch只有2个值。

    1)添加Segmented Control
    从object library中拖一个Segmented Control到iphone界面上
    然后调整Segmented Control位置以及它的宽度,如下图

    在Segmented Control的attributes inspector中有一个属性叫做Segments,这个值是用来设置有多少个分段,默认是2个,你可以将它的值设成100,看看其效果如何。

    像改变Label控件文字内容一样,鼠标双击Segmented Control上的文字,可以改变其内容,将“First”改成“Switches”,将“Second”改成“Button”,如下

    1)添加2个Switch
    从object library中拖两个Switch到iphone界面上,如下

    Switch的attribute不需要做改动,下面接着创建Outlet和Action

    3)添加Outlet和Action
    为2个Switch添加分别添加Outlet,然后2个Switch共用一个Action,Segmented Control使用一个Action
    为左边的Switch添加一个Outlet,命名为leftSwitch,为右边的Switch添加一个Outlet,命名为rightSwitch
     
    为左边的Switch添加一个Action,命名为switchChanged,添加完成后,将右边的Switch也关联到switchChanged

    为Segmented Control添加一个Action,命名为toggleControls

    添加完的BIDViewController.h如下

    复制代码
    #import <UIKit/UIKit.h>
    
    @interface BIDViewController : UIViewController
    @property (weak, nonatomic) IBOutlet UITextField *nameField;
    @property (weak, nonatomic) IBOutlet UITextField *numberField;
    @property (weak, nonatomic) IBOutlet UILabel *sliderLabel;
    @property (weak, nonatomic) IBOutlet UISwitch *leftSwitch;
    @property (weak, nonatomic) IBOutlet UISwitch *rightSwitch;
    
    - (IBAction)textFieldDoneEditing:(id)sender;
    
    - (IBAction)backgroundTap:(id)sender;
    
    - (IBAction)sliderChanged:(id)sender;
    
    - (IBAction)switchChanged:(id)sender;
    
    - (IBAction)toggleControls:(id)sender;
    
    @end
    复制代码

    (上面有很多其他的Outlet和Action,这个是使用了之前项目的原因)

    BIDViewController.m如下

    复制代码
    #import "BIDViewController.h"
    
    @implementation BIDViewController
    @synthesize nameField;
    @synthesize numberField;
    @synthesize sliderLabel;
    @synthesize leftSwitch;
    @synthesize rightSwitch;
    
    ...
    
    - (IBAction)switchChanged:(id)sender {
    }
    
    - (IBAction)toggleControls:(id)sender {
    }
    复制代码

    4)实现Switch Action
    在BIDViewController.m中的switchChanged方法中添加如下代码:

    - (IBAction)switchChanged:(id)sender {
        UISwitch *whichSwitch = (UISwitch *)sender;
        BOOL setting = whichSwitch.isOn;
        [leftSwitch setOn:setting animated:YES];
        [rightSwitch setOn:setting animated:YES];
    }

    因为leftSwitch和rightSwitch都关联到了switchChanged,因此,无论对哪个switch进行操作,都会调用到该方法,在该方法中,首先将sender强制转换成UISwitch类型,这样就可以使用UISwitch定义的属性了,isOn用来判断Switch的状态是打开还是关闭(Switch仅有的2种状态),最好根据触发事件的Switch状态,将另一个switch也设置成相同的状态,程序中为了方便,并没有判断到底是哪个switch触发了该Action,只是简单的将2个switch设成相同的状态而已。

    [rightSwitch setOn:setting animated:YES];

    setOn方法是根据后面的BOOL型参数的值来设置Switch的状态是打开还是关闭(ON,OFF)。
    animated是指当Switch从一种状态切换到另一种状态后,其滑块是否有活动效果,如果是YES,则滑块滑动的慢点,给人的感觉滑块是慢慢移动过去的,如果设成NO,滑块会很快地改变位置,滑动的速度很快。

    编译运行程序,用鼠标在模拟器中点击Switch控件,看看效果,2个switch的值应该始终是一样的,并且无论点击哪个switch,另一个switch的值也会随之改变。
    Switch is ON

    Switch is OFF

    5)添加Button
    Segmented Control在这个应用中的作用是切换Switch和Button,且Switch和Button同时只能有一个显示,另一个必须隐藏,因此我们在switch相同的位置添加Button,并设置Button按钮的属性为hidden,程序初始情况下不显示,然后需要显示Button时,只需切换segmented的值,Button就会显示,2个switch会被隐藏。

    在2个switch相同的位置上添加一个button

    拉伸button,使其完全遮住2个switch,并双击button,输入"Do Something"

    6)为button添加Outlet和Action
    添加Outlet是因为我们需要在改变segmented中来控制释放显示或隐藏button,当点击button后,Action会被触发。
    添加Outlet:doSomethingButton

    添加Action:buttonPressed

    7)隐藏button
    之所以到现在才设置button的隐藏属性(Hidden),是因为这样子会更加方便添加button的Outlet和Action,容易选择。
    选中button,在attributes inspector的View栏中找到“Hidden”的checkbox,并选中

    选中Hidden后,button变成不可见,但是在iphone的布局界面里,button仅仅是变成了透明而已,其外观还是可见的,在真实的运行环境里,button是看不见的。

    8)实现segmented的Action
    segmented的Action toogleControls我们之前已经添加完毕了,在其中添加如下code

    复制代码
    - (IBAction)toggleControls:(id)sender {
        if ([sender selectedSegmentIndex] == 0) {
            leftSwitch.hidden = NO;
            rightSwitch.hidden = NO;
            doSomethingButton.hidden = YES;
        }
        else {
            leftSwitch.hidden = YES;
            rightSwitch.hidden = YES;
            doSomethingButton.hidden = NO;
    
        }
    }
    复制代码

    第一个if语句,使用Segmented Control的selectedSegmentIndex方法来返回segment的哪个值(那一段)被选中(Segmented Control中的块的index从左到右从0开始编号),如果是第0个,说明Switch段被选中的,因此左右2个switch需要显示,button需要隐藏,因此设2个switch的hidden属性值为NO(false,不隐藏),button需呀隐藏,设其hidden值为YES(true,隐藏)。如果不是,则说明第1个被选中(这个程序中的segmented只有2段,不是第0段被选中就是第1段被选中),2个switch需要隐藏,button需要显示。

    编译运行,程序初始情况下,segmented的第0段被选中,2个switch显示

    鼠标选中segmented的Button,2个switch隐藏,button显示

    9)下一篇将实现button的Action
    到目前为止,所有新添加的控件,除了button的Action之外,都已经实现了其应有的功能。button的Action将在下一篇中完成,这里的button Action涉及到2个新的控件Action Sheet和Alert,这2个控件有点特殊,他们不是从object library拖到iphone界面上,而是会使用到delegate(其实delegate到目前为止我也不是理解的很清楚,还是有点迷茫,望高人能够指点),对我来说还有些复杂,因此放到下一篇中讲,望大家谅解。

  • 相关阅读:
    如何选择合适的MySQL存储引擎
    如何提高Windows操作系统内存利用效率
    jQuery插件 面包屑导航
    [Fireworks+Dreamweaver制作网站]第7课上
    一次完整的安全渗透测试
    jquery插件 跟随屏幕滚动的层
    [Fireworks+Dreamweaver制作网站]第1课
    [Fireworks+Dreamweaver制作网站]第2课
    随笔 幸福
    jQuery插件 jqueryflexselect下拉框自动提示
  • 原文地址:https://www.cnblogs.com/lovewx/p/3723331.html
Copyright © 2011-2022 走看看