【问题标题】:Custom uibarbuttonitem image to blend with background自定义 uibarbuttonitem 图像与背景混合
【发布时间】:2012-10-26 17:55:11
【问题描述】:

我正在为导航栏制作自定义 UI,我有一个问题与这篇文章中所问的完全一样

Custom background/transparent background on UIBarButtonItem?

在 StoryBoard 中,我尝试了各种组合以使我的 UIbarbuttonitem 着色为透明或清晰的颜色,但我仍然看到这个丑陋的黑色按钮(请参阅 + 符号)。如何实现透明效果,让按钮看起来与背景融为一体?

我的截图

其他一些应用截图。看看这看起来多漂亮?!

请注意,这里的 + 图像是我自己的自定义 png img,大小为 20 x 20 像素,具有透明/空白背景。

【问题讨论】:

    标签: iphone ios xcode ipad


    【解决方案1】:

    您可以使用 iOS 5 中引入的新外观 API 来实现这一目标以及更多功能。

    基本上,您只需为 UI 设置一次外观,它就会反映在整个程序中。

    这是UIBarButtonItem 的示例:

    // You can also use stretchable images
    UIImage *image = [[UIImage imageNamed:@"myCoolBarButton.png"]  resizableImageWithCapInsets:UIEdgeInsetsMake(0, 5, 0, 5)];
    [[UIBarButtonItem appearance] setBackgroundImage:image forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
    

    如果您不能使用 iOS 5,那么您必须像这样以编程方式构建它们:

    // Create a custom button with an image
    UIImage *image = [UIImage imageNamed:@"myCoolBarButton.png"];
    UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
    [button setImage:image forState:UIControlStateNormal];
    button.frame = CGRectMake(0.0, 0.0, image.size.width, image.size.height);
    
    // Create a custom UIBarButtonItem with the button
    UIBarButtonItem aBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView:aButton];
    

    无论如何,这里有一些关于外观主题的好教程的链接

    User Interface Customization in iOS 5

    How To Make Your App Stand Out With The New iOS 5 Appearance API

    编辑: 澄清一下,使用自定义图像比玩弄颜色、渐变和透明度要容易得多。

    【讨论】:

    • iska,myCoolBarButton.png 是一些经过处理的背景图像,而不是实际的 + 符号,对吗?我正在使用 iOS 5,并且仅支持该 iOS 及更高版本。
    • @SamBudda 是的。它是您要用于 UIBarButton 的背景图像,它可以是任何东西。您也可以使用普通,即。不可拉伸,图像。为此,只需留下 resizableImageWithCapInsets 部分。
    • 非常好。谢谢。现在唯一的问题是我的 + 按钮周围没有边框。
    • @SamBudda 不客气。通常你必须使用精心设计的图像,最好是带有边框和渐变。如果您按照链接中的教程进行操作,则可以下载示例项目并检查使用的图像。也许做一些类似的事情。
    【解决方案2】:

    你不能用色调来做到这一点。您必须同时设置导航栏的 backgroundImage 和栏按钮项的 backgroundImage,以便它们根据需要进行协调。

    在绘制条形按钮项的背景图像时,您可能必须绘制整个按钮,包括圆角矩形轮廓和圆角矩形轮廓的阴影,但这并不难,而且当一旦你可以永远重用代码,你就完成了。

    【讨论】:

    • 马特,我假设我们在这里不是在谈论 Photoshop,以便在我的 20x20 像素图像周围绘制一些边框。您是在谈论一些实现这种透明度的代码吗?如果可以,请分享链接/代码?
    • 是的,我说的是在代码中绘制一个按钮形状,如果需要的话。但是没有一些特定的代码,我认为您也不一定需要 Photoshop;使用 iOS 绘图很容易实现渐变和阴影之类的东西。这是我书中描述如何绘制的章节:apeth.com/iOSBook/ch15.html 在 iOS 6 中,使用新的 CIFilters,您可以做更强大的事情。
    【解决方案3】:

    我认为您带有 + 号的 png 图像不包含 alpha 通道。我有透明图像,它对我来说非常好。

    【讨论】:

    • 汤姆,你能上传你的示例透明图片吗?我会试一试,看看我的结局如何。谢谢
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-07-23
    • 1970-01-01
    • 2014-01-14
    • 1970-01-01
    • 2020-07-13
    相关资源
    最近更新 更多