自定义View步骤学习笔记

用途 : 一个View内部的子控件比较多的时候可以自定义一个View,把它内部的子控件屏蔽起来(就像苹果的导航栏上面的UIBarButton,你是通过BarButtonitem来修改显示的内容)

1.重写 initWithFrame 和 awakeFromNib(一般两个都要写),然后在写一个初始化的方法,在初始化方法中添加子控件和初始化子控件(当然也可以使用懒加载的方式来初始化子控件)

2.在layoutSubviews方法中调整子控件的位置和尺寸

3.提供一个模型属性,让外界来设置显示的内容

效果图: 

(当然这种效果也可以通过自定义Button来实现)

代码实现懒加载的方式(使用懒加载的好处是可以单独方法中设置子控件的属性,这样业务更加清晰)

文件有 : KFShopView和 KFShop

/*************** KFShop.h文件 ***************/

@interface KFShop : NSObject

@property (copy, nonatomic) NSString * name;

@property (copy, nonatomic) NSString * icon;

// 提供一个方法用于字典转模型

// 开发中我们要面对模型开发,而不是面对字典开发.例如 属性名如果写错了,编译器马上报错.如果是使用字典,写错了编译器并不会报错

- (instancetype)initWithDict:(NSDictionary *)dict;

+ (instancetype)shopWithDict:(NSDictionary *)dict;


@implementation KFShop

- (instancetype)initWithDict:(NSDictionary *)dict

{

if(self = [super init])

{

self.name = dict[@"name"];

self.icon = dict[@"icon"];

}

return self;

}

+ (instancetype)shopWithDict:(NSDictionary *)dict;

{

return [[self alloc] initWithDict:dict];

}

@end


/*************** KFShopView文件 ***************/

#import <UIKit/UIKit.h>

@class KFShop;

@interface KFShopView : UIView

@property (strong, nonatomic) KFShop *shop;

+ (instancetype)shopView;

@end

@interface KFShopView()


@property (weak, nonatomic) UIImageView * imageView;


@property (weak, nonatomic) UILabel * nameLabel;

@end

@implementation KFShopView

// 提供一个类方法用来快速创建shopView
+ (instancetype)shopView{

    KFShopView *shopView = [[self alloc] init];

    return shopView;

}

// 用到时才会创建imageView
- (UIImageView *)imageView{

    if(_imageView == nil){

        UIImageView * imageVeiw = [[UIImageView alloc] init];
        _imageView = imageVeiw;
        [self addSubview:_imageView];
    }

    return _imageView;

}

// 用到时才会创建nameLabel
- (UILabel *)nameLabel
{
    if(_nameLabel == nil)
    {
        UILabel * label = [[UILabel alloc] init];
        _nameLabel = label;
        label.font = [UIFont systemFontOfSize:14];
        label.textAlignment = NSTextAlignmentCenter;
        [self addSubview:_nameLabel];
    }

    return _nameLabel;

}

// 根据传进来的模型设置显示的内容
- (void)setShop:(KFShop *)shop
{
    _shop = shop;

    self.imageView.image = [UIImage imageNamed:self.shop.icon];
    self.nameLabel.text = shop.name;
}

// 布局子控件
- (void)layoutSubviews
{
    // 一定要调用super的方法
    [super layoutSubviews];

    CGFloat W = self.frame.size.width;
    CGFloat H = self.frame.size.height;

    self.imageView.frame = CGRectMake(0, 0, W, W);
    self.nameLabel.frame = CGRectMake(0, W, W, H - W);
}
时间: 2024-10-01 02:58:29

自定义View步骤学习笔记的相关文章

[原] Android 自定义View步骤

例子如下:Android 自定义View 密码框 例子 1 良好的自定义View 易用,标准,开放. 一个设计良好的自定义view和其他设计良好的类很像.封装了某个具有易用性接口的功能组合,这些功能能够有效地使用CPU和内存,并且十分开放的.但是,除了开始一个设计良好的类之外,一个自定义view应该: l 符合安卓标准 l 提供能够在Android XML布局中工作的自定义样式属性 l 发送可访问的事件 l 与多个Android平台兼容. Android框架提供了一套基本的类和XML标签来帮您创

继承ViewGroup自定义View:步骤、attrs.xml、TypedArray

时间:2015年12月22日19:01:46 自定义View的实现步骤: 1.写一个自定义控件类,这个类就是你的自定义控件的实现. 2.在res/values目录下建立一个attrs.xml的文件,在这个文件中增加对控件的自定义属性的定义. 3.使用带AttributeSet参数的类的构造函数,并在构造函数中将自定义控件类中变量与attrs.xml中的属性连接起来. 4.在自定义控件类中使用这些已经连接的属性变量. 5.将自定义的控件类定义到布局用的xml文件中去. 6.在界面中生成此自定义控件

Hive自定义函数的学习笔记(1)

前言: hive本身提供了丰富的函数集, 有普通函数(求平方sqrt), 聚合函数(求和sum), 以及表生成函数(explode, json_tuple)等等. 但不是所有的业务需求都能涉及和覆盖到, 因此hive提供了自定义函数的接口, 方便用户扩展. 自己好像很久没接触hadoop了, 也很久没博客了, 今天趁这个短期的项目, 对hive中涉及的自定义函数做个笔记. 准备: 编写hive自定义函数前, 需要了解下当前线上hive的版本. hive --vesion 比如作者使用到的hive

JSON中使用jsonmapper解析的代码和步骤 学习笔记

代码: using LitJson;using System;using System.Collections.Generic;using System.IO;using System.Linq;using System.Text;using System.Threading.Tasks; namespace JSON操作{ class Program { static void Main(string[] args) { //7.创建一个集合来储存我们遍历的三个对象并添加到这个集合中 List

小波说雨燕 第三季 构建 swift UI 之 UI组件集-视图集(七)Progress View视图 学习笔记

1 import UIKit 2 3 class ViewController: UIViewController{ 4 5 @IBOutlet weak var progress: UIProgressView! 6 7 let operationQueue = NSOperationQueue() 8 9 var 完成进度: Int = 0{ 10 didSet(oldValue){ 11 let 进度比 = Float(完成进度)/Float(100) 12 let 是否动画 = (old

小波说雨燕 第三季 构建 swift UI 之 UI组件集-视图集(六)Picker View视图 学习笔记

想对PickerView进行操作,只能在代码中操作. 下面 ,再添加三个label组件,然后将所有组件配置到代码中(看代码),然后要实现对PickerView的操作,就要实现它的DataSource协议和他的代理,在右边组件的链接栏,Outlets有两个选项,把他们都链接到控制器上: 好,我们的数据从哪里来? 我们在代码的控制器中定义几个数组,并且手工加上协议,然后会提示ViewController没有遵守协议UIPickerViewDataSource,因为我们没有实现: 下面我们就来实现协议

安装nmon监控步骤---学习笔记

Nmon 工具是 IBM 提供的免费的在AIX与各种Linux操作系统上广泛使用的监控与分析工具.该工具可将服务器的系统资源耗用情况收集起来并输出一个特定的文件,并可利用 excel 分析工具nmonanalyser进行数据的统计分析.并且,nmon运行不会占用过多的系统资源,通常情况下CPU利用率不会超过2%.针对不同的操作系统版本,nmon有相应版本的程序. 二.安装 安装:wget http://sourceforge.net/projects/nmon/files/nmon_linux_

自定义View的基本知识和步骤

当初刚入门Android时用的都是原生的控件,刚开始觉得原生的控件其实也可以满足当时的一些学校的小项目开发,也就没怎么深入自定义view.但参加工作后,发现有时美工给的设计图某些功能实现起来还是挺刁钻的,于是便开始了自定义view的学习.或许很多人都觉得自定义view是个很难的东西,其实当你真正用心去弄了几个自定义view之后就会发现其实也并没有那么难.由于个人工作效率还是蛮快的,项目之余闲蛋疼的很,常常自己看到那些好玩的东西就用自定义view画下来. 自定义view的基本步骤无非也就那么几步:

Android自定义view(初级篇)

Q1:为什么要自定义view? A:由于很多系统自带的view满足不了当前设计需求或者为了达到更良好的用户体验,增加UI的美化效果,就需要自定view Q2:自定义view有那几个步骤? A:>用户可根据需要extends View这个父类,然后重写父类的方法:如:onDraw();onMeasure()等: >如果用户在自定义View事需要添加属性,则必须在values文件夹下新建"attrs.xml"文件,在其中添加自定义属性. 下面来进行自定义view的学习. 一.最