0821基本控件实例1 ——图片浏览器

一、项目需求——照片浏览器


二、开发步骤


1. 新建项目

2. 搭建UI界面

3. 建立IBOutlet,以便代码能够处理界面元素

4. 建立IBAction,以便界面上某些事件发生时执行方法

5. 代码实现

提示:为了便于理解,开发过程分两个步骤完成

三、演练说明


1、本节使用到的控件包括:UILabel,UIImageView,UISwitch,UIStepper和UISlider五个基本控件,除了第一个UILabel大家已经接触过之外,其他的四个控件都是第一次接触

2、开发过程中首先通过两张图片的交替,演示控件的基本使用

3、待基本控件的使用基本熟悉之后,再引入新的话题:数据模型

四、UIImageView——图像视图


作用:专门用来显示图片的控件

1. 设置图像

[self.imageView setImage:[UIImage imageNamed:@"abc.png"]];

2. 设置显示模式

–设置图片居中显示,并且保持原来宽高比

imageView.contentMode = UIViewContentModeScaleAspectFit;

五、UISlider——滑块控件1


作用:用来显示进度值,并且可以手动修改进度值

1. 基本设置

// 设置滑块最大值

[slider setMaximumValue:15];

// 设置滑块最小值

[slider setMinimumValue:0];

// 设置滑块当前数值

[slider setValue:5];

2. 事件监听

监听UISlider的进度值改变,应该用Value Changed事件

通过代码为UISlider添加监听器:

[slider addTarget:self action:@selector(sliderChange:)
forControlEvents:UIControlEventValueChanged];

当UISlider的进度值发生改变时,会自动调用self的sliderChange:方法,并且将UISlider作为第一个参数传入

- (void) sliderChange:(UISlider *)slider

{

}

六、UISwitch——开关控件


作用:开关

1. 设置On或者Off

[mySwitch setOn:YES];

2. 判断当前状态

BOOL state = [mySwitch isOn];

3. 事件监听

–监听UISwitch的状态改变,应该用Value Changed事件(参照UISlider的使用)

七、UIStepper——计数器控件


作用:计数

1. 基本设置与滑块控件类似

2. 与滑块控件的区别:

–每按一次减号,value就会自动减去一定的数值(数值大小由stepValue决定)

–每按一次加号,value就会自动增加一定的数值(数值大小由stepValue决定)

3. 事件监听

–监听UISwitch的状态改变,应该用Value Changed事件(参照UISlider的使用)

八、UISegmentControl——选项卡控件


作用:同一时刻只能选中一个标签

1. 基本设置

NSArray *items = @[@"2列", @"3列", @"4列"];

UISegmentedControl *control = [[UISegmentedControl alloc]
initWithItems:items];

2. 获得当前被选中的标签位置

int index = control.selectedSegmentIndex;

3. 事件监听

–监听UISegmentControl的状态改变,应该用Value Changed事件(参照UISlider的使用)

九、扩充:UIImageView的序列帧动画


UIImageView可以让一系列的图片在特定的时间内按顺序显示

属性说明:

–animationImages:要显示的一组图片序列

–animationDuration:完整地显示所有图片所需的时间

–animationRepeatCount:动画的执行次数(默认为0,代表无限循环)

相关方法:

- (void)startAnimating; 开始动画

- (void)stopAnimating; 停止动画

- (BOOL)isAnimating; 是否正在运行动画

代码段1:


//
// ViewController.m
// -照片查看器
//
// Created by apple on 13-8-22.
// Copyright (c) 2013年 apple. All rights reserved.
//

#import "ViewController.h"

// 在.m文件中定义的属性、成员变量、以及方法,只能在当前类中访问,不开放出去
// 面向对象程序设计的原则:开放封闭原则,开闭原则,对内部开放,对外部封闭
@interface ViewController ()
{
// NS后面没有Mutable字样的类型,是不可变类型,创建之后不能修改
// 相反,有Mutable字样的类型,是可变类型,创建之后仍然可以修改
// NSArray => 数组
// NSMutableArray => 可变数组
// NSString => 字符串
// NSMutableString => 可变字符串
// NSDictionary => 字典
// NSMutableDictionary => 可变字典
// NSSet => 数据集
// NSMutableSet => 可变数据集

// 当前显示的照片索引
NSInteger _photoIndex;
}

// 图像数组
@property (strong, nonatomic) NSMutableArray *imageData;

@end

@implementation ViewController
/**
用数据字典、数组的方式来同步信息
*/
- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.

// 需求:我们需要一个连续的“图像序列”,以保证界面上的控件能够在图像之间切换
// 图像序列=>定义成员变量的数组

// 实例化图像数组
_imageData = [NSMutableArray array];

// 设置图像视图的图像
for (int i = 0; i < 16; i++) {
NSString *fileName = [NSString stringWithFormat:@"%d.png", i];
UIImage *image = [UIImage imageNamed:fileName];

// 向图像数组添加内容
[_imageData addObject:image];
}

[_imageView setImage:_imageData[0]];

_photoIndex = 0;
}

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

#pragma mark - Actions
#pragma mark 夜间模式
- (IBAction)nightMode:(id)sender
{
UISwitch *mySwitch = (UISwitch *)sender;

// 开启夜间模式
if ([mySwitch isOn]) {
[self.view setBackgroundColor:[UIColor grayColor]];
} else {
// 关闭夜间模式
[self.view setBackgroundColor:[UIColor whiteColor]];
}
}

#pragma mark 计数器数值变化
- (IBAction)stepperChanged:(id)sender
{
UIStepper *myStepper = (UIStepper *)sender;

NSLog(@"计数器数值 %f", [myStepper value]);

NSInteger index = myStepper.value - 1;
[_imageView setImage:_imageData[index]];

[_imageSlider setValue:(index + 1)];
}

#pragma mark 滑块数值变化
- (IBAction)sliderChanged:(id)sender
{
// 注意:滑块控件是没有类似step之类的属性的!!!
UISlider *mySlider = (UISlider *)sender;

NSLog(@"滑块数值 %f", [mySlider value]);

// 通过NSLog发现,在拖拽滑块的时候,图片会被重复设置
// 使用一个成员变量,记录当前显示的图像的索引数值,如果sender传过来得数值变化,再去修改图像

NSInteger index = mySlider.value - 1;

if (index != _photoIndex) {
[_imageView setImage:_imageData[index]];
_photoIndex = index;

NSLog(@"设置照片了");

// 同步计数器控件数值
[_imageStepper setValue:(_photoIndex + 1)];
}

// 滑块和计数器没有同步
}

@end

代码段2:


//
// ViewController.m
// 序列帧动画
//
// Created by apple on 13-8-22.
// Copyright (c) 2013年 apple. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

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

[self setDonghua:11 andButton:_zhaoyunImage];
}

- (void)setDonghua:(NSInteger)count andButton:(UIImageView *)imageView
{
NSMutableArray *imagesList = [NSMutableArray array];

for (NSInteger i = 1; i < count; i++) {
// 生成图像文件名
NSString *fileName = [NSString stringWithFormat:@"%d.png", i];
UIImage *image = [UIImage imageNamed:fileName];

// 把图像添加到数组
[imagesList addObject:image];
}

[imageView setAnimationImages:imagesList];
// 2.2 设置动画播放的时长
[imageView setAnimationDuration:1.0];

// 2.4 设置动画播放次数
[imageView setAnimationRepeatCount:1];

// 2.3 开始动画
[imageView startAnimating];

}

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

@end

0821基本控件实例1 ——图片浏览器,布布扣,bubuko.com

时间: 2024-10-11 07:56:09

0821基本控件实例1 ——图片浏览器的相关文章

[iOS基础控件 - 3.3] 图片浏览器

需求: 1.显示当前图片序号/总图片数 2.显示图片 3.上一张图片.下一张图片转换 4.显示图片描述 A.数据的加载方式 1.逐个加载.处理 2.使用数组.字典分离数据和逻辑 3.延迟加载 将初始化放在getter初始化,当需要的数据不存在才初始化 4.使用plist 存储数据在外部文件,剥离数据和逻辑代码 不要使用带”info”的名字,会跟系统文件混淆 a.使用NSBundle获得手机全路径 1 if (_imageData == nil) { 2 // 初始化数据 3 // File: 全

0821基础控件(UIButton常用属性)

一.可以通过代码的方式创建UIButton 1.通用实例化对象方法: UIButton *button = [[UIButton alloc] initWithFrame:rect]; 2.快速实例化对象方法: UIButton *button = [UIButton buttonWithType:UIButtonTypeRoundedRect]; 提示: 在OC开发中,实例化任何类型的非自定义对象,都请首先尝试一下是否存在快速定义方法.如果存在快速定义方法,就尽量不要使用init之类的方法实例

Atitit.hybrid混合型应用 浏览器插件,控件的实现方式 浏览器运行本地程序的解决方案大的总结---提升用户体验and开发效率..

Atitit.hybrid混合型应用 浏览器插件,控件的实现方式 浏览器运行本地程序的解决方案大的总结---提升用户体验and开发效率.. 1. hybrid App 1 1.1. Hybrid App为什么会兴起编辑 1 1.2. 如何实现网页语言与程序语言的混合编辑 2 1.2.1. 多View混合型 2 1.2.2. 单View混合型 2 1.2.3. Web主体型 2 1.3. Hybrid App的瓶颈与未来编辑 3 2. Web App.Hybrid App.Native APP对比

Android控件上添加图片

项目中有一个点赞功能,点赞的小图标添加在点赞列表旁边,在xml里可以进行设置,也可以在代码中进行绘图. 下面是两种方法的设置: 1.xml里:一些控件:button.textView等等里面有个属性是android:drawableLeft 就可以将pic设置到text的左边.good.... 2.代码中: TextView txtlikedList = new TextView(this.getContext()); Drawable drawable= getResources().getD

0821基础控件(UILabel常用属性)

一.UILabel常用属性1--实例化和设置文字 // 实例化UILabel并指定其边框 UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(0.0, 210.0, 320.0, 40.0)]; // 设置label显示的文本 [label setText:@"Hello World"]; // 设置字体和字体大小 [label setFont:[UIFont fontWithName:@"Helvetica-B

通过WebBrowser控件,实现IE浏览器菜单功能

这篇文章所讲的技术,只支持IE浏览器,请读者注意 WebBrowser控件,是IE浏览器的内置控件.顾名思义,这个控件我们可以看成是浏览器本身.通过WebBrowser控件,可以实现一部分IE浏览器的菜单命令. 1. 使用 首先在画面上要通过<object>标签创建这个控件. <OBJECT classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height=0 id=WebBrowser width=0></OBJECT>

使用CefSharp 在C#用户控件中嵌入Chrome浏览器使用方法

CEF(Chromium Embedded Framework, 嵌入式Chromium框架)是C/C++开发的库 目前 Google Chrome(Google浏览器),Chromium浏览器,Opera等都是基于CEF为核心,Webkit引擎的浏览器. Xilium.CefGlue是对CEF项目的.net的包装,它是用P/Invoke的方式来调用CEF类库.CEFSharp是用C++/CLI的方式来调用CEF类库的. 原先使用的是Xilium.CefGlue,如果只是单纯在窗口上实现的话是没

Android调用相册拍照控件实现系统控件缩放切割图片

android 下如果做处理图片的软件 可以调用系统的控件 实现缩放切割图片 非常好的效果 今天写了一个demo分享给大家 package cn.m15.test; import java.io.ByteArrayOutputStream;import java.io.File;import android.app.Activity;import android.content.Intent;import android.graphics.Bitmap;import android.net.Ur

对话框上动态控件的创建、在Picture Control控件上显示图片

1  MFC对话框之上的动态控件的创建 对话框上的控件是MFC类的一个具体对象. 当在对话框之上使用静态控件时,可以根据类向导来为每个控件添加消息.响应函数以及变量. 当需要在对话框中动态的创建某个控件时,就需要手动来代替类向导为动态控件添加消息.响应函数及变量. 动态创建控件时,可按照以下步骤进行: (1) 明确控件所属于的类 每一个控件都对应着一个类(例如按钮Button所属于的类为CButton). 如,在程序中我们需要用CButton类创建一个具体的按钮对象,并用函数指示它在对话框之上的