iOS 让UIButton根据文字内容自动计算宽高

Xcode自带的UIButton控件是没有办法根据文字内容计算自身的宽和高的,下面演示一下问题,

我用代码方式创建一个UIButton,并且设置了一些属性,下面看一下效果图

一切都是这么的美好,跟我们想要的一样啊,btn也跟着文字内容进行自身宽高的更改了啊!那我再设置多一点文字

怀着满怀激动的心情,再看一下效果图

哇哦,怎么变成这个样子了。文字内容都超出btn控件了,跟我们想象的不一样啊。这个问题该如何解决呢?

既然Xcode自带的UIButton类满足不了我们的需求。那么我们就自定义一个UIButton类,只需要继承UIButton就可以了

我在.m文件中重写init方法

其实就是实例化的时候,给Button内部添加了一个uilable控件,这个uilable控件和button之间有约束。首先大家应该懂得系统自带的button控件中有两个子控件,UIImageView 和 UILable,

因为系统自带的UILable和父控件UIButton之间的约束不满足我们目前的需求,所以我重新创建一个UILable,自己设置约束,把文字信息显示在自己创建的UILable上面,不用系统自带的uilable了。下面重写方法

当我把这三个方法重写完毕以后,我再给btn设置有关文本的属性的时候,就会调用上面的方法,那么,我重写就是为了把文字信息本来是设置在UIButton自带的UILable上面的,我重写以后就会把文字信息设置在我自己创建的lable上面,lable会根据文字内容改变自己的大小,因为lable与button之间也有约束,所以Button也会跟着改变了。

下面看一下效果

和我们想要的效果就一样了。

总结:由于UIButton控件有两个子控件:UIImageView(用来显示图片),UILable(用来显示文字);但是系统定义的UILable和UIButton之间的约束不满足我们目前的需求,所以我自己定义一个类,继承UIButton,在初始化的时候,给UIButton再添加一个自己定义的UILable控件,把这个UILable控件和Button之间的约束设置为目前我们需求的约束。当我再给Button设置文字的时候,就设置给自定义的UILable控件中(也就是重写的那几个方法),这个时候自定义的UILable灰根据文字的内容自动计算自己的宽高,因为UILable和button之间有约束,button自身的宽高也会跟着改变。所以button本身自带的UILable我们就不使用了,

时间: 2024-10-25 14:06:48

iOS 让UIButton根据文字内容自动计算宽高的相关文章

iOS学习-压缩图片(改变图片的宽高)

压缩图片,图片的大小与我们期望的宽高不一致时,我们可以将其处理为我们想要的宽高. 传入想要修改的图片,以及新的尺寸 -(UIImage*)imageWithImage:(UIImage*)image scaledToSize:(CGSize)newSize { // Create a graphics image context UIGraphicsBeginImageContext(newSize); // Tell the old image to draw in this new cont

Android:使用canvas绘柱状统计图(自动计算宽高及分度值、可左右滑动)

本例实现了一个简单的柱状统计图,如下:        特点: 1.根据数据源自动计算每个条目的高度.宽度.间距,自动计算分度值. 2.当条目数较多时,可左右滑动查看全部内容,图形.文字同步滑动,并且松手后会渐渐的停下来(而不是立刻停下来). 代码: (1)核心代码:BarChartView.java package com.sina.appbarchart; import android.app.Activity; import android.content.Context; import a

android 文字尺寸(宽高)的测量

FontMetrics 可以测量高度 关于FontMetrics的几个重要属性的解析   1.ascent 2.descent 3.top 4.bottom 5.leading 6.baseline 理解这个是重点 可以理解为是X轴   注意 android 坐标系的特点 Y轴 向下是正方向 向上是负方向   关于 baseline 的确定 在自定义 view 的时候 通过 drawText 这个方法 将 文字 绘制到界面 其中 这个方法的 第二个 和 第三个 参数就决定了baseline的位置

两行文字,固定宽高,超出部分以三点隐藏

代码如下: display: -webkit-box; 必须结合的属性 ,将对象作为弹性伸缩盒子模型显示 .-webkit-box-orient 必须结合的属性 ,设置或检索伸缩盒对象的子元素的排列方式 .text-overflow: ellipsis;,可以用来多行文本的情况下,用省略号“…”隐藏超出范围的文本 .overflow : hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webki

ios label 自动计算行高详解

在OC当中自动计算行高主要调用系统的 p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #ffffff } span.s1 { } span.s2 { color: #00b1ff } span.s3 { color: #de38a6 } span.s4 { color: #eb905a } span.s5 { color: #8b87ff } - (--boundingRectWithSize:(CGSize)

窗口尺寸,文档高,元素宽高的获取方式

一.元素宽高: window.onload = function() {    var oDiv = document.getElementById('div1');     /*        width height        style.width : 样式宽        clientWidth : 可视区宽        offsetWidth    : 占位宽    */        alert( oDiv.style.width );    //100    alert( o

那些宽高

所有元素产生偏移一的参照物是文档(浏览器的左上角) 会产生偏移量的属性:标准流(就是盒子上下排列),float,margin,position的absolute或rellative 定位是在margin外面开始定位的 offsetLeft/offsetTop          左偏移和上偏移 offsetHeight/offsetWidth   内容的宽/高+padding+border clientWidth/clientHeight     可见内容的宽/高+padding scrollTo

盒子不同模式下的宽高判断

曾经遇到过这样的问题,设定一个div,当给div设置padding的时候,发现整个div的宽高都发生了变化,这里就产生了一个疑惑,一个盒子的总体宽高到底是怎么去判断的呢? 经过查询得知,盒子宽高的判定模式一共有两种,分别为标准模式和怪异模式. 为了能更好的理解我们先设定一个div并给它设定样式: 1 #content1{ 2 width: 200px; 3 height: 200px; 4 border: 2px solid black; 5 margin: 20px; 6 padding: 2

iOS 根据文字字数动态确定Label宽高

iOS7中用以下方法 - (CGSize)sizeWithAttributes:(NSDictionary *)attrs; 替代过时的iOS6中的- (CGSize)sizeWithFont:(UIFont *)font 方法 // iOS7_API_根据文字 字数动态确定Label宽高 // 设置Label的字体 HelveticaNeue Courier UIFont *fnt = [UIFont fontWithName:@"HelveticaNeue" size:24.0f]