(转)设置 UILabel 和 UITextField 的 Padding 或 Insets (理解UIEdgeInsets)
转自http://unmi.cc/uilable-uitextfield-padding-insets 主要是理解下UIEdgeInsets在IOS UI里的意义.
靠,这货其实就是间隔,起个名字这么让人费解!!!正值表示间隔值,负值表示超出参照物的距离。
--------------------------------------------------------分割线,下面是转载原文---------------------------------------------------
iOS 的控件,只看到 UIButton 可以设置 Padding/Insets,即按钮上文字或图片与按钮边界的间隙,对与 CSS 来说叫做 Padding,在 iOS 中叫做 Insets,UIButton 设置 Insets 相应的属性如下:
Configuring Edge Insets
contentEdgeInsets property
titleEdgeInsets property
imageEdgeInsets property
它们接受的属性类型是:UIEdgeInsets,由函数 UIEdgeInsetsMake ( CGFloat top, CGFloat left, CGFloat bottom, CGFloat right ); 构造出,分别表示其中的内容/标题/图片离各边的距离。
在 xib 中也有界面来对按钮的这三个 EdgeInsets 属性的设置,分别是按钮的 Edge 和 Inset 属性。
印像中,Swing 的许多组件都可设置 Insets 属性,可对于 iOS 的控件就没那么幸运了,比如我想设置 UILable 或 UITextField 中的文本离边界的间隙,无伦是在 xib 里还是直接代码的方式都无能为力,因为它们根据未开放相应的属性让你去控制。
办法当然还是有的,自定义相应自己的控件了,比如 InsetsLabel 或是 InsetsTextField,接着就是覆盖某些个方法来达成。
首先来看 UILabel 的子类 InsetsLabel 的实现代码:
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
|
//1.header file#import <UIKit/UIKit.h>@interface InsetsLabel : UILabel@property(nonatomic) UIEdgeInsets insets;-(id) initWithFrame:(CGRect)frame andInsets: (UIEdgeInsets) insets;-(id) initWithInsets: (UIEdgeInsets) insets;@end//2. implementation file#import "InsetsLabel.h"@implementation InsetsLabel@synthesize insets=_insets;-(id) initWithFrame:(CGRect)frame andInsets:(UIEdgeInsets)insets { self = [super initWithFrame:frame]; if(self){ self.insets = insets; } return self;}-(id) initWithInsets:(UIEdgeInsets)insets { self = [super init]; if(self){ self.insets = insets; } return self;}-(void) drawTextInRect:(CGRect)rect { return [super drawTextInRect:UIEdgeInsetsInsetRect(rect, self.insets)];} |
关键就是覆盖了 -(void) drawTextInRect: (CGRect) rect; 方法,在画 Label 的文本时分别设置文本与 Label 四个边的间隙,即画在 Label 内的一个小矩形内,这个例子提供了便利的构造函数,提供自己的 UIEdgeInsets 属性。另外,函数 UIEdgeInsetsInsetRect(CGRect, UIEdgeInsets) 应该是好理解的。
再看如何设置 UITextField 中文本到四边的间距,这里也可以定义自己的 InsetsTextField:
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
|
//// Created by Unmi on 11/2/11.// Copyright (c) 2011 http://unmi.cc. All rights reserved.//#import <UIKit/UIKit.h>@interface InsetsTextField : UITextField@end@implementation InsetsTextField//控制 placeHolder 的位置,左右缩 20- (CGRect)textRectForBounds:(CGRect)bounds { return CGRectInset( bounds , 20 , 0 );}// 控制文本的位置,左右缩 20- (CGRect)editingRectForBounds:(CGRect)bounds { return CGRectInset( bounds , 20 , 0 );}@end//-----------------------------------------------------------------//下面是使用 InsetsTextField 的代码,可放在 viewDidLoad 等代理方法中InsetsTextField *insetTextField = [[InsetsTextField alloc] initWithFrame:CGRectMake(10, 10, 180, 25)];//须手动设置它的 borderStyle, 不然看不到边框的insetsTextField.borderStyle = UITextBorderStyleRoundedRect;[self.view addSubview:insetsTextField];[insetsTextField release]; |
效果如下:
上面更像是借鉴的 InsetsLabel 的实现,其实对于 UITextField 还有更好的实现办法,而且更简单,因为 UITextFiled 原来就支持的做法。比如它可以让你做出在文本框最前方固定一个 $ 符号,表示这个文本框是输入钱的,第一个$ 是不能被删除的。确实,你可以在 TextField 上贴个 Label,然后文本框的光标后移,稍显麻烦了。
而 UITextField 可以直接设置 leftView 或 rightView, 然后文本输入区域就在 leftView 和 rightView 之间了,看例子:
|
1
2
3
4
5
6
|
UILabel *paddingView = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 10, 25)];paddingView.text = @"$";paddingView.textColor = [UIColor darkGrayColor];paddingView.backgroundColor = [UIColor clearColor];textfield.leftView = paddingView;textfield.leftViewMode = UITextFieldViewModeAlways; |
rightView 也是一样的设置方式,其中的 Mode 有四种,看到名字应该不难理解:
UITextFieldViewModeNever,
UITextFieldViewModeWhileEditing,
UITextFieldViewModeUnlessEditing,
UITextFieldViewModeAlways
它的效果呢就更酷了:

文本框的起始光标是从上图数字 1 位置开始的。
实际应用中,对于 UITextField 如果有类似的需求,我会毫不犹豫的使用 leftView/rightView 属性来设置。
参考:1. http://stackoverflow.com/questions/2694411/text-inset-for-uitextfield
2. http://stackoverflow.com/questions/5674655/uitextfield-align-left-margin
(转)设置 UILabel 和 UITextField 的 Padding 或 Insets (理解UIEdgeInsets)的更多相关文章
- 设置 UILabel 和 UITextField 的 Padding 或 Insets (理解UIEdgeInsets)
转自http://unmi.cc/uilable-uitextfield-padding-insets 主要是理解下UIEdgeInsets在IOS UI里的意义. 靠,这货其实就是间隔,起个名字这么 ...
- iOS 设置UILabel 的内边距
iOS 设置UILabel 的内边距 - (void)drawTextInRect:(CGRect)rect { UIEdgeInsets insets = {, , , }; [super draw ...
- UIButton、UILabel、UITextField 初学者需要了解的基本定义和常用设置
以下是三个IOS开发中最常用的控件,作为IOS基础学习教程知识 ,初学者需要了解其基本定义和常用设置,以便在开发在熟练运用. UIButton按钮 第一.UIButton的定义 UIButton * ...
- ##DAY2 UILabel、UITextField、UIButton、UIImageView、UISlider
##DAY2 UILabel.UITextField.UIButton.UIImageView.UISlider #pragma mark ———————UILabel——————————— UILa ...
- iOS 设置UILabel的行间距并自适应高度
NSString *contentStr = @"总以为,在最初的地方,有一个最原来的我,就也会有一个最原来的你"; UILabel *tempLabel = [[UILabel ...
- 设置UIButton中的文字和图片,设置UILabel的文在显示不同颜色
UIButton: UIEdgeInsets 在UIButton中有三个对EdgeInsets的设置:ContentEdgeInsets.titleEdgeInsets.imageEdgeInsets ...
- 关于margin:-10000px;padding:10000px;的理解
原文链接: 内外补丁负值法是指通过内外补丁的设置来解决一些我们通常方法不能实现的效果.例如:可以通过改变盒模型的样式来使几列div由内容撑开高度但几列div与最高的一栏等高的问题.但是为什么会出现这样 ...
- 如何设置UILabel中的字体的间距
cell.teacherDescriptionLabel.text = content; cell.teacherDescriptionLabel.textAlignment = NSTextAlig ...
- 设置UILabel可变高度(根据文本内容自动适应高度)
@property(nonatomic)UILabel *showLabel; // 计算文本所占高度,计算出来之后设置label的高度 // 第一个参数:字体大小,字体大小/样式影响计算字体的高 ...
随机推荐
- C# 10 总复习
数据类型--变量与常量--运算符与表达式--语句(if,for)--数组--函数--结构体 一.数据类型: (一)内建类型 整型(int short long byte uint ushort ulo ...
- 关于使用HttpSessionBindingListener获取在线用户数,同一用户登陆一次
原创地址:http://blog.csdn.net/jiaoxueli/article/details/2226134 考虑到项目中统计在线用户数量和同一用户只能登陆一次的需求,查询联系 HttpSe ...
- thinkphp从数据库里的html代码显示页面不解析
首先,这个问题不应该出现在这里,因为以前在用ThinkPHP3.1.2的时候,利用富文本编辑器保存文本后,直接从数据库里面取出的数据都能正常显示,改用ThinkPHP3.2.3之后,thinkphp从 ...
- Git客户端使用
1.下载安装包 git: https://git-for-windows.github.io/index.html tortoisegit: https://download.tortoisegit ...
- android xml解析 sax
1.简要概述 Android 各种文件都是xml格式的,还有标准的webservice返回的是xml文件,虽然现在的json使用在移动设备端越来越广泛,但是xml格式的解析感觉还是相当必要. 2.sa ...
- 【自学php】第四天 - 使用数组
php支持两种数组,数字索引数组和关联数组.关联数组有点类似Map,可以用字符串或其他数据类型做键对应相应的值保存在数组中. 1.初始化数组 数字索引数组的初始化可以使用如下代码: $products ...
- RoHS认证简介
RoHS认证是<电气.电子设备中限制使用某些有害物质指令>(The restriction of the use of certain hazardous substances in el ...
- 使用Flex图表组件
原文 http://blog.csdn.net/mylxiaoyi/article/details/1618470 使用Flex图表组件 以图表或是图的方式显示数据的能力可以使得Flex程序用户的数据 ...
- CC++初学者编程教程(12) 基于rhel6.3的Oracle数据库学习环境搭建
前言 安装oracle 11g系统最好是1G以上内存,硬盘至少需要4.5G空间. 至少环境在Linux Server release 5.3以上. win安装包 win32_11gR2_databas ...
- .NET,你忘记了么?(八)—— 从dynamic到特性误用 [转]
1. 摘要 每个程序员都想写出漂亮的代码,但是什么是漂亮,这个我想每个人都有着自己的看法.那么我就说几种典型的想法: A. 写出别人看不懂的代码,让别人觉得很高深. B. 写出简短的代码 C. 用最新 ...