IOS开发学习笔记020-练习总结

自己做了一遍，现在再复习一下，总结一下。

最终效果如下

       

1、新建一个工程Single View Application

总体如下

不过要关闭自动布局功能

这是按下设置按钮显示的界面
默认是隐藏的，可以在设置时改变坐标显示出来，之后在隐藏

关于导入图片:

　　可以新建一个组，将图片拖拽到文件夹里。

给各个组件设置默认值，这里准备的时16张图片，所以都是按16张算得

　　顶部默认是1/16

　　滑动条是0到15，默认是0

　　图片默认显示 0.png

2、然后给各个需要的控件添加属性和监听事件

如下：

 #import <UIKit/UIKit.h>

 @interface SLQViewController : UIViewController
 - (IBAction)sliderValueChanged:(UISlider *)slider;  // 滑动条-改变图显示顺序的监听事件
 @property (weak, nonatomic) IBOutlet UIImageView *imageView; // 图片显示对象
 @property (weak, nonatomic) IBOutlet UILabel *imageNum; // 顶部图片显示的顺序
 @property (weak, nonatomic) IBOutlet UILabel *imageInfo; // 底部图片的描述信息
 @property (weak, nonatomic) IBOutlet UIView *settingView; // 设置界面
 - (IBAction)setting:(id)sender; // 设置按钮监听事件
 - (IBAction)imageSizeChange:(UISlider *)sender;// 设置界面改变图片大小的监听事件
 - (IBAction)nightModel:(UISwitch *)sender;// 设置界面switch按钮的监听事件

 @end

3、主界面代码实现

　　1、先让顶部的lable标签随滚动条值的改变而改变

　　这里定义的又 imageNum 属性来控制lable标签。还有滑动条的监听事件 imageSizeChange

　　首先获取滑动条改变值，然后设置要显示在 imageNum 的信息。

    // 设置显示第几张， %.f 不保存任何小数，因为是从0开始的，所以显示要加1
    _imageNum.text = [NSString stringWithFormat:@"%.f/16",slider.value + ];

　　随着滑动条的拖拽，imageNum　的值一直在改变。

　　2、接着显示图片  imageView

　　首先获取滑动条改变值，然后设置要显示在 imageView 的信息。

     // 设置中间的图片
     // 获得文件名 %.f 不保存任何小数,图片的编号是从0开始的，直接取就行
     NSString *name = [NSString stringWithFormat:@"%.f.png",slider.value]; // 
4　　　_imageView.image = [UIImage imageNamed:name]; // 设置要显示的图片到控件

　　随着滑动条的拖拽，图片　的值一直在改变。注意观察和顶部文字顺序是否一致。

　　3、显示图片的文字描述信息iamgeInfo

　　因为有十几张图片的描述信息，所以我们使用plist来保存文字信息。然后通过代码读取文件获得信息。

　　首先新建一个plist文件

　　

　　然后选择类型为数组，点击加号添加条目

　　

　　添加结果如下

　　

　　现在就来读取这个plist文件，需要使用到一个类 NSBundle，获取主程序的全路径

　　NSBundle 会获取主程序的安装目录，可以读取下面的配置文件。使用方式如下：

     // 如果要访问资源包中得所有资源，可以通过这个类访问，
     NSBundle *bundle = [NSBundle mainBundle];
     // 获取全路径
     NSString *path = [bundle pathForResource:@"desc" ofType:@"plist"];
     // 加载所有描述
     _array= [NSArray arrayWithContentsOfFile:path];
  

　　其中_array 是定义的一个NSArray数组的属性，用来保存文字描述信息

　　又因为这个文字描述从读取出来后一直没有改变，所以把它的读取放在 viewDidLoad 方法中。

　　viewDidLoad方法会在主界面加载后执行，并且只会执行一次。

　　读取文件如下

 - (void)viewDidLoad
 {
     [super viewDidLoad];
     // Do any additional setup after loading the view, typically from a nib.

     // 设置描述
     // 如果要访问资源包中得所有资源，可以通过这个类访问，
     NSBundle *bundle = [NSBundle mainBundle];
     // 获取全路径
     NSString *path = [bundle pathForResource:@"desc" ofType:@"plist"];
     // 加载所有描述
     _array= [NSArray arrayWithContentsOfFile:path];
      _imageInfo.text = _array[]; // 设置默认显示描述
 }

　　设置要显示的描述 改变imageInfo控件的text属性的值

     // 设置描述，因为slider.value是按浮点值进行改变的，强制转换成int型要进行四舍五入1.40-> 1,但是如果加0.5就会改善这种误差
     int index = (int)(slider.value + 0.5); // +0.5是为了消除强制转换的四舍五入所
     _imageInfo.text = _array[index]; // 设置显示描述

4、设置界面的实现 settingView

　　1、实现按下弹出，再次按下隐藏

　　首先在main.storyboard界面将settingView隐藏起来，将坐标改到刚好隐藏到底部。我这里设置的y坐标是480　　

 - (IBAction)setting:(id)sender
 {
     // 动画开始
     [UIView beginAnimations:nil context:nil];
     // 设置动画时间
     [UIView setAnimationDuration:0.5];
     // 取出中点，现在是隐藏状态的中点
     CGPoint center = _settingView.center;

     // 修改y值，如果要_settingView的y坐标值和整个主界面的高度相同，那么就没显示到主界面中
     if (_settingView.frame.origin.y == self.view.frame.size.height) // 没出现就弹出
     {
         center.y -= _settingView.bounds.size.height; // _settingView的y值减去自身的高度，那么可将界面显示到主界面
     }
     else
     {
         center.y += _settingView.bounds.size.height; // 已经出现就隐藏
     }
     // 重新赋值
     _settingView.center = center;
     // 执行动画
     [UIView commitAnimations];
 }

　　2、夜间模式实现

　　这里实现的比较简单，知识改变主界面的背景色

 - (IBAction)nightModel:(UISwitch *)sender
 {
     if (!sender.on) // 如果开关关闭就显示白色
     {
         self.view.backgroundColor = [UIColor whiteColor]; // 关闭--背景显示白色

     }
     else // 否则显示灰色
         self.view.backgroundColor = [UIColor darkGrayColor]; // 打开--背景显示灰色
 }

　　3、图片大小改变

　　这里直接改变图片控件的transform属性

 - (IBAction)imageSizeChange:(UISlider *)sender
 {
     // transform 属性修改
     _imageView.transform = CGAffineTransformMakeScale(sender.value, sender.value);
 }

整个 SLQViewController.m文件如下：

 //
 //  SLQViewController.m
 //  图片浏览器
 //
 //  Created by Christian on 15/4/25.
 //  Copyright (c) 2015年 itcast. All rights reserved.
 //

 #import "SLQViewController.h"

 @interface SLQViewController ()
 {
     NSArray *_array; // 保存文字描述信息
 }

 @end

 @implementation SLQViewController

 - (void)viewDidLoad
 {
     [super viewDidLoad];
     // Do any additional setup after loading the view, typically from a nib.

     // 3、设置描述
     // 如果要访问资源包中得所有资源，可以通过这个类访问，
     NSBundle *bundle = [NSBundle mainBundle];
     // 获取全路径
     NSString *path = [bundle pathForResource:@"desc" ofType:@"plist"];
     // 加载所有描述
     _array= [NSArray arrayWithContentsOfFile:path];
      _imageInfo.text = _array[]; // 设置默认显示描述
 }

 - (void)didReceiveMemoryWarning
 {
     [super didReceiveMemoryWarning];
     // Dispose of any resources that can be recreated.
 }

 - (IBAction)sliderValueChanged:(UISlider *)slider
 {
     // 1、设置中间的图片
     // 获得文件名 %.f 不保存任何小数
     NSString *name = [NSString stringWithFormat:@"%.f.png",slider.value];
     _imageView.image = [UIImage imageNamed:name];
     // 2、设置显示第几张
     _imageNum.text = [NSString stringWithFormat:@"%.f/16",slider.value + ];
     // 3、设置描述
     int index = (int)(slider.value + 0.5); // +0.5是为了消除强制转换的四舍五入所
     _imageInfo.text = _array[index];

     // NSLog(@"%d",index);

 }
 - (IBAction)setting:(id)sender
 {
     // 动画开始
     [UIView beginAnimations:nil context:nil];
     // 设置动画时间
     [UIView setAnimationDuration:0.5];
     // 取出中点，现在是隐藏状态的中点
     CGPoint center = _settingView.center;

     // 修改y值，如果要_settingView的y坐标值和整个主界面的高度相同，那么就没显示到主界面中
     if (_settingView.frame.origin.y == self.view.frame.size.height) // 没出现就弹出
     {
         center.y -= _settingView.bounds.size.height; // _settingView的y值减去自身的高度，那么可将界面显示到主界面
     }
     else
     {
         center.y += _settingView.bounds.size.height; // 已经出现就隐藏
     }
     // 重新赋值
     _settingView.center = center;
     // 执行动画
     [UIView commitAnimations];
 }

 - (IBAction)imageSizeChange:(UISlider *)sender
 {
     // transform 属性修改
     _imageView.transform = CGAffineTransformMakeScale(sender.value, sender.value);
 }

 - (IBAction)nightModel:(UISwitch *)sender
 {
     if (!sender.on) // 如果开关关闭就显示白色
     {
         self.view.backgroundColor = [UIColor whiteColor]; // 关闭--背景显示白色

     }
     else // 否则显示灰色
         self.view.backgroundColor = [UIColor darkGrayColor]; // 打开--背景显示灰色
 }

 @end

整个过程大概就是这样，每天进步一点点。