IOS改变UISearchBar中搜索框的高度

2016-02-19 09:15 6 1 收藏

只要你有一台电脑或者手机,都能关注图老师为大家精心推荐的IOS改变UISearchBar中搜索框的高度,手机电脑控们准备好了吗?一起看过来吧!

【 tulaoshi.com - 编程语言 】

一、系统的searchBar
1、UISearchBar的中子控件及其布局
UIView(直接子控件) frame 等于 searchBar的bounds,view的子控件及其布局

UISearchBarBackground(间接子控件) frame 等于searchBar的bounds
UISearchBarTextField(间接子控件) frame.origin等于(8.0, 6.0),即不等于searchBar的bounds

2、改变searchBar的frame只会影响其中搜索框的宽度,不会影响其高度,原因如下:

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/bianchengyuyan/) 系统searchBar中的UISearchBarTextField的高度默认固定为28
左右边距固定为8,上下边距是父控件view的高度减去28除以2

二、改变UISearchBar的高度
1、方案
重写UISearchBar的子类(IDSearchBar),重新布局UISearchBar子控件的布局
增加成员属性contentInset,控制UISearchBarTextField距离父控件的边距

若用户没有设置contentInset,则计算出默认的contentInset
若用户设置了contentInset,则根据最新的contentInset布局UISearchBarTextField

2、具体实现
重写UISearchBar的子类

class IDSearchBar: UISearchBar {}

增加成员属性contentInset(可选类型),控制UISearchBarTextField距离父控件的边距,监听其值的改变,重新布局searchBar子控件的布局

var contentInset: UIEdgeInsets? {  didSet {self.layoutSubviews()  }}

重写layoutSubviews()布局searchBar的子控件

override func layoutSubviews() {  super.layoutSubviews()  // view是searchBar中的唯一的直接子控件  for view in self.subviews {// UISearchBarBackground与UISearchBarTextField是searchBar的简介子控件for subview in view.subviews {  // 找到UISearchBarTextField  if subview.isKindOfClass(UITextField.classForCoder()) {if let textFieldContentInset = contentInset { // 若contentInset被赋值  // 根据contentInset改变UISearchBarTextField的布局  subview.frame = CGRect(x: textFieldContentInset.left, y: textFieldContentInset.top, width: self.bounds.width - textFieldContentInset.left - textFieldContentInset.right, height: self.bounds.height - textFieldContentInset.top - textFieldContentInset.bottom)} else { // 若contentSet未被赋值  // 设置UISearchBar中UISearchBarTextField的默认边距  let top: CGFloat = (self.bounds.height - 28.0) / 2.0  let bottom: CGFloat = top  let left: CGFloat = 8.0  let right: CGFloat = left  contentInset = UIEdgeInsets(top: top, left: left, bottom: bottom, right: right)}  }}  }}

三、IDSearchBar使用示例
1、未设置contentInset
设置searchBar的frame

searchBar.frame = CGRect(x: 80, y: 100, width: 200, height: 40)

效果如图

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/bianchengyuyan/)


2、设置contentInset
设置searchBar的frame

searchBar.frame = CGRect(x: 80, y: 100, width: 200, height: 40)

设置searchBar的contentInset

// 设置contentInsetsearchBar.contentInset = UIEdgeInsets(top: 0, left: 8, bottom: 0, right: 8)

效果如图

四、IDSearchBar的设计原则
1、注意

UISearchBar默认是有自己默认的布局方式的
设计IDSearchBar旨在改变searBar中搜索框的高度,但是可能会有改变宽的的需求

2、设计原则

在没有改变searchBar中搜索框的高度的需求时,需要使用UISearchBar的默认布局
若需要改变searchBar中搜索框的高度的需求时,需要按照需求来改变UISearchBar的布局
为了增加可控性,在IDSearchBar中增加成员属性contentInset来控制IDSearchBar的内边距

以上就是本文的全部内容,希望对大家的学习有所帮助。

来源:https://www.tulaoshi.com/n/20160219/1590063.html

延伸阅读
代码如下:  txtlbl.font = [UIFont boldSystemFontOfSize:14.0f];     txtlbl.numberOfLines = 0;  NSString *str = @"        阿方决定设立科技特网络离开电视剧分w额两个大陆高科技了了不见了日i倒计时离开我说老师肯德基弗兰克萨江东父老将费德勒说阿方决定设立科技特网络...
标签: Web开发
今天我将介绍一下如何使用CSS中的背景图片来设计你的搜索框。之前我使用别的方法来实现我的表单和搜索框,但是这种方法看起来会更容易些,所以我想将它与感兴趣的朋友分享。 View Demo 原始方式 首先来让我们看看我的原始的使用input type=”image” src=”image_url” /的方法: form method="get" id="searchform" actio...
在用VC开发应用程序时,经常会要做一些可以改变大小的对话框,而这个时候就要求对话框上的控件会随着对话框大小的改变而改变自己的位置和大小。如果控件比较少,那可以在对话框的OnSize()事件里面添加代码,通过计算来调整各个控件的位置和大小;但是,如果对话框上的控件比较多的话,那这将是一件非常痛苦的事情!要是程序中又有很多可以...
标签: windows10
win10系统任务栏中搜索框去除方法   用户在安装win10系统后,会在任务栏中显示搜索栏,该搜索栏占据了一部分任务栏的空间,并且对于用户来说,这个搜索栏的作用在工作中并不能为我们提供便捷的操作,所以我们可完全将其去掉,不过一些用户不知道如何去除win10系统任务栏中的搜索框,故此河东软件园为大家提供了该教程,需要的用户赶快...
钉钉搜索框支持关键字搜索吗?   支持,可以通过拼音、关键字进行搜索;

经验教程

995

收藏

90
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部