黑马程序员_iOS 的基础控件之UILabel，UISlider，UIImageView

iOS，Android，Java培训，期待与您的交流
iOS应用开发的一项内容就是用户界面的开发。不管应用程序实际包含的逻辑有多复杂，如果这个应用程序没有提供友好的图形用户界面，將很难吸引用户。作为一个程序设计者，必须优先考虑用户的感受，一定要让用户感到爽，这个应用程序才有价值。
1    UILabel
UILabel的作用是显示文本，不能编辑文本，它直接继承UIView。除了UIView所支持的属性外，现介绍UILbel常用的额外属性：
1、Text：用于设置显示的文本，可以设置任何字符串
2、Color：用于设置文本的颜色
3、Font：用于设置本文的字体，文字大小和字体风格
4、Alignment：用于设置文本的对齐方式
5、Lines用于设置文本行数，默认是1

- (void)viewDidLoad
{
    [super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
    //创建一个UILabel，坐标(10,10),宽度100，高度50
    UILabel *label1 = [[UILabel alloc] initWithFrame:CGRectMake(10, 10, 100, 50)];
    label1.text = @"the first label";   //设置显示的文本
    label1.textColor = [UIColor redColor];  //设置文本的颜色为红色
    label1.font = [UIFont systemFontOfSize:15]; //设置文本为系统默认字体，大小为15
    label1.textAlignment = NSTextAlignmentCenter;   //设置文本的对齐方式是居中对齐
    label1.numberOfLines = 0;   //设置文本的行数，0表示没有限制，文本如果太长，会自动换行显示
    label1.text = @"the first label this is test";  //显示长文本

    [self.view addSubview:label1];
}

2    UISlider
UISlider通过滑块的位置来标识数值，并且允许拖动滑块。因此UISlider通常用于对系统的某种数值进行调节，比如调节音量，控制播放进度等。
1、Value:用于设置UISlider的位置范围，包括Minimum和Maxmum
2、监听事件Value Changed，当UISlider的位置发生变化，会触发该事件

- (void)viewDidLoad
{
    [super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
    //创建UISlider，坐标(10,200)，宽度200，高度20
    UISlider *slider = [[UISlider alloc] initWithFrame:CGRectMake(10, 200, 200, 20)];

    //设置最小值和最大值
    slider.minimumValue = 0;
    slider.maximumValue = 7;

    //绑定UIControlEventValueChanged事件的处理方法
    [slider addTarget:self action:@selector(change:) forControlEvents:UIControlEventValueChanged];

    [self.view addSubview:slider];
}


- (void) change:(UISlider*)slider
{
    NSLog(@"UISlider的值%f",slider.value);
}

3    UIImageView
UIImageView用于显示图片，它直接继承UIView。因此，UIImage只能作为图片的显示控件，不能接受用户输入。

    //创建UIImageView，用于保存图片，并且充满整个屏幕
    UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];

    //创建UIImage，代表一张图片
    UIImage *image = [UIImage imageNamed:@"0.png"];

    //將图片放到UIImageView
    imageView.image = image;

    [self.view addSubview:imageView];

4    图片浏览器
图片浏览器的界面如下图所示，最上面的UILabel显示第几张图片，中间的UIImageView用于显示图片，下面的UILabel显示图片的描述，最下面的UISlider则用来切换图片。
ViewController定义成员变量_allDescs，它是NSArray，用于保存的图片的描述信息。图片的描述信息放在plist文件，需要解析该文件，將信息保存到NSArray成员变量。

    
- (void)viewDidLoad
{
    [super viewDidLoad];

    // 1.获得所有的描述(通过解析plist文件来创建数组对象，比如传入文件的全路径)
    // 如果要访问项目中资源包里面的所有资源。应该用mainBundle
    NSBundle *bundle = [NSBundle mainBundle];
    // 获得文件的全路径
    NSString *path = [bundle pathForResource:@"descs" ofType:@"plist"];
    // 加载path对应的文件来创建数组 
    _allDescs = [NSArray arrayWithContentsOfFile:path];

    // 2.设置默认的描述
    _imageDesc.text = _allDescs[0];

    //self.set
}

拖动UISlider，切换图片。原理是监听UISlider的位置，如果位置发生了变化，在监听事件中更换UIImageView的图片，并且更换UILabel的显示文本。

    
- (IBAction)sliderValueChange:(UISlider *)sender {
    // 1.设置中间的图片
    // 获得图片名称  %.f 不保留任何小数
    NSString *imageName = [NSString stringWithFormat:@"%.f.png", sender.value];
    _imageView.image = [UIImage imageNamed:imageName];

    // 2.设置序号（第几张），即更改最上面的UILabel的显示文本
    _imageNo.text = [NSString stringWithFormat:@"%.f/16", sender.value + 1];

    // 3.设置描述，更改下面UILabel的显示文本
    int no = (int)(sender.value + 0.5);
    _imageDesc.text = _allDescs[no];  

iOS，Android，Java培训，期待与您的交流