带边框的UIImage缩放

一个带边框的UIImage如果使用常规的缩放,边框部分将被按照缩放比例拉伸或压缩,有些时候这并不是我们所期望的..比如这个边框是根据图片大小变化的外框。比如下面的类似按钮的不明物体图片:主体为渐变蓝色,边框为外圈白色,灰色底板为背景。

常见的按钮添加和背景设置如下:

UIButton *button = [[UIButton alloc] initWithFrame:CGRectMake(80, 130, 160, 44)];
[button setTitle:@”Test Button” forState:UIControlStateNormal];
// Image with without cap insets
UIImage *buttonImage = [UIImage imageNamed:@”blueButton”];
[button addTarget:self action:@selector(buttonPressed:) forControlEvents: UIControlEventTouchUpInside];
[button setBackgroundImage:buttonImage forState:UIControlStateNormal];
[[self view] addSubview:button];

所得到的按钮会相当悲剧…

边框,特别是左右边框由于按钮frame过大被惨烈拉伸… iOS5中提供了一个新的UIImage方法,resizableImageWithCapInsets:,可以将图片转换为以某一偏移值为偏移的可伸缩图像(偏移值内的图像将不被拉伸或压缩)。

用法引述如下:

resizableImageWithCapInsets:
  Creates and returns a new image object with the specified cap insets.
  - (UIImage *)resizableImageWithCapInsets:(UIEdgeInsets)capInsets
    Parameters
      capInsets
      The values to use for the cap insets.
    Return Value
      A new image object with the specified cap insets.
    Discussion
      You use this method to add cap insets to an image or to change the existing cap insets of an image. In both cases, you get back a new image and the original image remains untouched.

      During scaling or resizing of the image, areas covered by a cap are not scaled or resized. Instead, the pixel area not covered by the cap in each direction is tiled, left-to-right and top-to-bottom, to resize the image. This technique is often used to create variable-width buttons, which retain the same rounded corners but whose center region grows or shrinks as needed. For best performance, use a tiled area that is a 1x1 pixel area in size.

输入参数为一个capInsets结构体:

//Defines inset distances for views.
typedef struct {
CGFloat top, left, bottom, right;
} UIEdgeInsets;

分别表示上左下右四个方向的偏移量。于是把上面按钮的UIImage改为如下形式:

// Image with cap insets
UIImage *buttonImage = [[UIImage imageNamed:@”blueButton”]
resizableImageWithCapInsets:UIEdgeInsetsMake(0, 16, 0, 16)];

可以得到如下按钮:

问题得到解决。

但是值得注意的是该方法需要至少iOS5的运行环境,因此对于需要开发支持iOS5之前的App来说是不可行的。替代方案是stretchableImageWithLeftCapWidth:topCapHeight:,但是在iOS5中,这已经是被Deprecated的方法了,而且该方法只能以1px作为重复铺满拉伸区域,无法做到类似渐变等图片效果,是存在一定局限的。

转载自:https://onevcat.com/

时间: 2025-01-27 06:41:06

带边框的UIImage缩放的相关文章

【Qt编程】基于Qt的词典开发系列<四>--无边框窗口的缩放与拖动

        在现在,绝大多数软件都向着简洁,时尚发展.就拿有道的单词本和我做的单词本来说,绝大多数用户肯定喜欢我所做的单词本(就单单界面,关于颜色搭配和布局问题,大家就不要在意了).有道的单词本: 我所做的单词本:         很明显,两者的主要区别就是周围的边框问题.你可以对比QQ以前的版本和这几年的版本,就会发现都倾向于下面这种窗口模式.下面我们就说说如何用Qt实现无边框窗口的缩放与拖动.         对于无边框窗口的拖动其实很简单,其基本思想是,在鼠标移动前后记录鼠标的坐标,然

iOS中 切圆角,任意几个角(带边框,不带边框)__OC和Swift版本 韩俊强的博客

需求: 1.日常我们在切控件圆角时会遇到想切任意圆角? 2.切过圆角带边框和不带边框的选择? 那么今天我们就用Objective-C和Swift都给它实现了: OC代码: UILabel *myLabel = [[UILabel alloc]initWithFrame:CGRectMake(100, 100, 200, 70)]; myLabel.text = @"Hi,小韩哥!"; myLabel.font = [UIFont systemFontOfSize:20.0]; myLa

利用Android中BitmapShader制作自带边框的圆形头像_Android

效果如下: BitmapShader 的简单介绍 关于 Shader是什么,Shader的种类有哪几种以及如何使用不属于本文范畴,对这方面不是很了解的同学,建议先去学习一下 Shader 的基本使用. BitmapShader主要的作用就是 通过Paint对象,对 画布进行指定的Bitmap填充,实现一系列效果,可以有以下三种模式进行选择       1.CLAMP - 拉伸,这里拉伸的是图片的最后一个元素,不断地重复,这个效果,在图片比较小,而所要画的面积比较大的时候会比较明显.      

Swift开发在UIView上绘制矩形(直角,圆角,带边框)

当系统要显示一个视图(UIView)时,它会向视图发送drawRect(rect:)消息.所以,如果我们需要在视图上进行绘制,则可以在drawRect方法内部实现.   1,用纯色填充的矩形 下面创建一个长宽都为100的矩形UIView,坐标(50,50).其内部使用绿色填充. 开发在UIView上绘制矩形(直角,圆角,带边框)-swift uiview 圆角">    代码如下 复制代码 import UIKit   class ViewController: UIViewControl

android中用xml文件实现带边框背景效果的方法

前言 在项目开发的过程中,有时我们会用到带边框的纯色背景图,类似效果如下: 一般的,我们会让设计给做个背景图,然后自己用.9处理一下,这样有些麻烦,我们可以简洁点实现,就是用xml文件. 下面给出一个范例: <?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android" &g

Android Studio实现带边框的圆形头像

本文实例为大家分享了Android Studio实现带边框的圆形头像的具体代码,供大家参考,具体内容如下 效果显示: (没有边框的) (有边框的) 1.创建自定义ImagView控件 (1).没有边框的 package chenglong.activitytest.pengintohospital.utils; import android.content.Context; import android.graphics.Bitmap; import android.graphics.Bitma

winform中如何处理无边框窗体的缩放和托动

在winform经常用到无边框的窗体,原因就是想使自己的程序界面完全的自定义,网上也有过不少的相关资料 今天我发了一下的午的时间整理了一下.觉得还不错,贴出来看看. 为了提高托动的缩放的效率,减少系统开销,一般软件都用支持只显示窗体四周的虚线的方法,这也是windows默认的设置 首先看下其它软件的窗体托动,先说QQ2009吧,QQ2009的主窗体在托动时如果在屏幕上来回快速托动,等停下来时你会发现,很有可能鼠标现在在窗体的位置已经不是按下的位置了.再说酷我音乐盒.鼠标在托动或缩放窗体时,如果鼠

求助无边框窗口的缩放问题

问题描述 C#中formborderstyle为none的窗口怎样实现缩放,用鼠标任意的改变它大小?还有,这种类型的窗口做主窗口时,点击任务栏中标签的时候无法实现最小化,怎么解决?要用到窗口和任务栏的句柄么? 解决方案 解决方案二:privateconstintWM_NCHITTEST=0x84;privateconstintHTCLIENT=0x1;privateconstintHTCAPTION=0x2;protectedoverridevoidWndProc(refMessagem){ba

鼠标触及带边框菜单

导航菜单 网页特效 学习教程 网页模版 源码下载 平面设计