jjzjj

iphone - UIButton 上的 iOS 可拉伸(stretch)图像显示不稳定的角

coder 2023-09-26 原文

好的伙计们,

我到处搜索,似乎找不到解决我的问题的方法。

我正在尝试使用一个相当大的图像作为按钮背景以获得 UIButton 的自定义外观并减小应用程序的整体大小,因为这似乎是正确的做法。

但是,当我尝试在按钮上设置图像时,按钮看起来很奇怪,而且边角与常规 UIButton 的标准边角半径不匹配。

我已经尝试创建多种不同尺寸的图像,但似乎没有任何效果。

我知道大写字母应该是均匀的,我已经加上 1 像素的中间部分来拉伸(stretch)。

我的 UIButton 是 44 高。如果我创建一个 44 像素高和 21 像素宽的图像,并且具有与默认按钮相同的圆角半径(它像阿司匹林胶囊),并像这样设置我的背景图像:

UIImage *btnImage = [UIImage imageNamed:@"buttontest1.png"];
UIImage *newImg = [btnImage stretchableImageWithLeftCapWidth:10 topCapHeight:0];

边角不匹配,看起来奇怪地被广泛拉伸(stretch)并且按钮的高度增加了!

我知道 stretchableImagewithLeftCapWidth 已被弃用,但使用 resizableCapWithInsets 对我来说更没有意义,当我尝试这样做时,按钮图像似乎一遍又一遍地重复。

谁能找出我做错了什么?有什么地方可以简单地解释这个废话吗?我似乎无法理解。

谢谢! -TJ

编辑 - 在使用 resizableImageCapWithInserts 显示结果后添加图像。它们不可能是典型的,因为我看到了所有应该有效的例子,但这些例子对我来说从来没有用过。我刚刚弄清楚如何在此处添加图片,所以这可能对某些人有所帮助。

这是 21px 宽 x 39px 高的 PNG 文件

这是使用以下代码设置背景图片的结果:

[self.button1 setBackgroundImage:[[UIImage imageNamed:@"buttontest4.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 10, 0, 10)] forState:UIControlStateNormal];

据我了解,这应该按原样复制我的 21 像素宽图像的左侧 10 个像素和右侧 10 个像素,并在中间拉伸(stretch) 1 个像素,这似乎是这样做的,但它也使我的按钮在垂直方向上变大并且我得到这个奇怪的重复。它应该与旁边的 BTN 大小相同。

这是我的 Xcode 布局:

无论我使用什么图像,我都会看到相似的结果。

我显然不是在摸索什么。

我很感激到目前为止的回答。雾越来越少了。

张杰

EDIT2:显示使用 21px x 44px 图像的 cap insets 方法的样本。

在 Storyboard中设计时,所有 4 个按钮的高度均为 44px。

如您所见,橙色按钮都比白色按钮大,以便进行比例比较。

顶部按钮是 button1,底部是 button2。

我找到了一种通过使用 UIImageResizingModeStretch 的可选 resizingMode 参数使其更接近的方法。

但是,请注意按钮比应有的大。

这里是设置按钮图像的代码。

- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.

[self.button1 setBackgroundImage:[[UIImage imageNamed:@"buttontest1a.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(10, 10, 10, 10)] forState:UIControlStateNormal];

[self.button2 setBackgroundImage:[[UIImage imageNamed:@"buttontest1a.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 10, 0, 10) resizingMode:UIImageResizingModeStretch]  forState:UIControlStateNormal];
}

用 (10,10,10,10) 制作顶部图像得到的图像不会像以前那样重复图像的顶部。我知道顶部图像没有使用可选的调整大小参数,因为这是一个测试,看看每个图像能给我带来什么。

现在,让事情变得更加复杂。如果我将我的顶部按钮大小设置为 43,即比我的图像小一个像素并使用可选的调整大小参数进行调用,我将获得近乎完美的结果,只是我的按钮大小不正确。

这到底是怎么回事?

我感谢所有试图通过我厚厚的脑袋敲打一些知识的人。 田杰

最佳答案

UIEdgeInsets 有点难以理解,但它更现代的用法。我将解释它的工作方式。基本上,使用四个偏移量,您将图像分成 9 个切片。如果您想查看这可能是什么样子的图像,请查看 this page 的“可缩放区域”部分(注意,它是针对 Android 的,但概念是相同的。Android 只是先这样做了)。您会注意到图像中有四行。这些将对应于您的四个插图。所以你的九个部分,从左到右和从上到下将是:

  1. X: 0 -> 左内插,Y: 0 -> 上内插
  2. X:左内嵌 ->(宽度 - 右内嵌),Y:0 -> 上内嵌
  3. X: (Width - Right Inset) -> Width, Y: 0 -> Top Inset
  4. X:0 -> 左内插,Y:上内插 ->(高度 - 下内插)
  5. X:左插图 ->(宽度 - 右插图),Y:顶部插图 ->(高度 - 底部插图)
  6. X:(宽度 - 右插图)-> 宽度,Y:顶部插图 ->(高度 - 底部插图)
  7. X:0 -> 左插图,Y:(高度 - 底部插图) -> 高度
  8. 左插图 ->(宽度 - 右插图),Y:(高度 - 底部插图) -> 高度
  9. X:(宽度 - 右插图)-> 宽度,Y:(高度 - 底部插图)-> 高度

第1、3、7、9节已定型,不会拉伸(stretch)。
第 2 和第 8 部分将仅水平拉伸(stretch)
第 4 和第 6 部分将仅垂直拉伸(stretch)
第 5 节将向两个方向延伸。

iOS 6 中的新功能,您可以选择一种模式。您可以拉伸(stretch)可拉伸(stretch)的瓷砖,或重复它们以获得您想要的效果(颜色等应该拉伸(stretch),而纹理应该重复)。

关于iphone - UIButton 上的 iOS 可拉伸(stretch)图像显示不稳定的角,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12666331/

有关iphone - UIButton 上的 iOS 可拉伸(stretch)图像显示不稳定的角的更多相关文章

  1. ruby-on-rails - date_field_tag,如何设置默认日期? [ rails 上的 ruby ] - 2

    我想设置一个默认日期,例如实际日期,我该如何设置?还有如何在组合框中设置默认值顺便问一下,date_field_tag和date_field之间有什么区别? 最佳答案 试试这个:将默认日期作为第二个参数传递。youcorrectlysetthedefaultvalueofcomboboxasshowninyourquestion. 关于ruby-on-rails-date_field_tag,如何设置默认日期?[rails上的ruby],我们在StackOverflow上找到一个类似的问

  2. ruby-on-rails - openshift 上的 rails 控制台 - 2

    我将我的Rails应用程序部署到OpenShift,它运行良好,但我无法在生产服务器上运行“Rails控制台”。它给了我这个错误。我该如何解决这个问题?我尝试更新ruby​​gems,但它也给出了权限被拒绝的错误,我也无法做到。railsc错误:Warning:You'reusingRubygems1.8.24withSpring.UpgradetoatleastRubygems2.1.0andrun`gempristine--all`forbetterstartupperformance./opt/rh/ruby193/root/usr/share/rubygems/rubygems

  3. ruby-on-rails - 相关表上的范围为 "WHERE ... LIKE" - 2

    我正在尝试从Postgresql表(table1)中获取数据,该表由另一个相关表(property)的字段(table2)过滤。在纯SQL中,我会这样编写查询:SELECT*FROMtable1JOINtable2USING(table2_id)WHEREtable2.propertyLIKE'query%'这工作正常:scope:my_scope,->(query){includes(:table2).where("table2.property":query)}但我真正需要的是使用LIKE运算符进行过滤,而不是严格相等。然而,这是行不通的:scope:my_scope,->(que

  4. ruby - 如何验证 IO.copy_stream 是否成功 - 2

    这里有一个很好的答案解释了如何在Ruby中下载文件而不将其加载到内存中:https://stackoverflow.com/a/29743394/4852737require'open-uri'download=open('http://example.com/image.png')IO.copy_stream(download,'~/image.png')我如何验证下载文件的IO.copy_stream调用是否真的成功——这意味着下载的文件与我打算下载的文件完全相同,而不是下载一半的损坏文件?documentation说IO.copy_stream返回它复制的字节数,但是当我还没有下

  5. Ruby 文件 IO 定界符? - 2

    我正在尝试解析一个文本文件,该文件每行包含可变数量的单词和数字,如下所示:foo4.500bar3.001.33foobar如何读取由空格而不是换行符分隔的文件?有什么方法可以设置File("file.txt").foreach方法以使用空格而不是换行符作为分隔符? 最佳答案 接受的答案将slurp文件,这可能是大文本文件的问题。更好的解决方案是IO.foreach.它是惯用的,将按字符流式传输文件:File.foreach(filename,""){|string|putsstring}包含“thisisanexample”结果的

  6. ruby-on-rails - 添加回形针新样式不影响旧上传的图像 - 2

    我有带有Logo图像的公司模型has_attached_file:logo我用他们的Logo创建了许多公司。现在,我需要添加新样式has_attached_file:logo,:styles=>{:small=>"30x15>",:medium=>"155x85>"}我是否应该重新上传所有旧数据以重新生成新样式?我不这么认为……或者有什么rake任务可以重新生成样式吗? 最佳答案 参见Thumbnail-Generation.如果rake任务不适合你,你应该能够在控制台中使用一个片段来调用重新处理!关于相关公司

  7. Get https://registry-1.docker.io/v2/: net/http: request canceled while waiting - 2

    1.错误信息:Errorresponsefromdaemon:Gethttps://registry-1.docker.io/v2/:net/http:requestcanceledwhilewaitingforconnection(Client.Timeoutexceededwhileawaitingheaders)或者:Errorresponsefromdaemon:Gethttps://registry-1.docker.io/v2/:net/http:TLShandshaketimeout2.报错原因:docker使用的镜像网址默认为国外,下载容易超时,需要修改成国内镜像地址(首先阿里

  8. ruby-on-rails - 在 Ruby (on Rails) 中使用 imgur API 获取图像 - 2

    我正在尝试使用Ruby2.0.0和Rails4.0.0提供的API从imgur中提取图像。我已尝试按照Ruby2.0.0文档中列出的各种方式构建http请求,但均无济于事。代码如下:require'net/http'require'net/https'defimgurheaders={"Authorization"=>"Client-ID"+my_client_id}path="/3/gallery/image/#{img_id}.json"uri=URI("https://api.imgur.com"+path)request,data=Net::HTTP::Get.new(path

  9. python ffmpeg 使用 pyav 转换 一组图像 到 视频 - 2

    2022/8/4更新支持加入水印水印必须包含透明图像,并且水印图像大小要等于原图像的大小pythonconvert_image_to_video.py-f30-mwatermark.pngim_dirout.mkv2022/6/21更新让命令行参数更加易用新的命令行使用方法pythonconvert_image_to_video.py-f30im_dirout.mkvFFMPEG命令行转换一组JPG图像到视频时,是将这组图像视为MJPG流。我需要转换一组PNG图像到视频,FFMPEG就不认了。pyav内置了ffmpeg库,不需要系统带有ffmpeg工具因此我使用ffmpeg的python包装p

  10. ruby-on-rails - Ruby - 如何从 ruby​​ 上的 .pfx 文件中提取公钥、rsa 私钥和 CA key - 2

    我有一个.pfx格式的证书,我需要使用ruby​​提取公共(public)、私有(private)和CA证书。使用shell我可以这样做:#ExtractPublicKey(askforpassword)opensslpkcs12-infile.pfx-outfile_public.pem-clcerts-nokeys#ExtractCertificateAuthorityKey(askforpassword)opensslpkcs12-infile.pfx-outfile_ca.pem-cacerts-nokeys#ExtractPrivateKey(askforpassword)o

随机推荐