自定义标签栏项目背景图片的正确尺寸是多少？ [英] What are the correct dimensions for a custom tab bar item background image?

问题描述

所以我有 .png 这是428x176 px：

So I have a .png that's 428x176 px:

当项目处于选定状态时，我想将它用作标签栏背景图像。问题是图像太大了。所以现在，我正在探索不同的分辨率后缀：@ 1x，@ 2x，@ 3x。但无论我附加到图像文件名，图像对于标签栏项目的背景仍然太大，尽管随着我增加分辨率因子它会变小。如何确定此图像的正确尺寸应该是什么？

I want to use it as a tab bar background image for when an item is in the selected state. The problem is that the image is too big. So now, I'm exploring the different resolution suffixes: @1x, @2x, @3x. But regardless of which I append to the image filename, the image remains too big for the tab bar item's background, although it does get smaller as I increase the resolution factor. How do I determine what the correct dimensions for this image should be?

请记住，这是任何特定 UITabBarItem <的背景图像/ code>处于选中状态。它意味着 UITabBarItem 的整个宽度和高度。我的标签栏将在屏幕宽度上放置三个项目。

Keep in mind that this is a background image for when any particular UITabBarItem is in the selected state. It is meant to be the entire width and height of the UITabBarItem. My tab bar will have three items laid across the width of the screen.

很多答案是提供基于swift的解决方案，但我要求的是我的图像应该以像素为单位的尺寸，换句话说，我应该在包中包含什么尺寸的图像，以便图像适合标签栏中的所有屏幕尺寸。我想，因为默认情况下 UITabBar 需要 UIImage 的 selectionIndicatorImage 字段而不是 UIImageView 必须有一个解决方案，不涉及黑客攻击 UITabBar 和添加一个 UIImageView 作为它的子视图，并根据哪个 UITabBarItem 目前已被选中。

A lot of answers are providing swift based solutions, but what I'm asking for is what dimensions my image should be in pixels, in other words, what sized images should I be including in my bundle, so that the image will fit in the tab bar at all screen sizes. I imagine that since a UITabBar by default expects a UIImage for its selectionIndicatorImage field and not a UIImageView that there must be a solution that doesn't involve hacking around the UITabBar and adding a UIImageView as a subview of it and managing what position the image view should be in, manually, based on which UITabBarItem is currently selected.

推荐答案

回答这个问题如何让UITabBar选择指标图像填满整个空间？作为参考：

Making my answer for this question how to make UITabBar selection indicator image fill the whole space? as reference:

UITabBarController的子类

适用于多个设备即使有轮换。

备注：

1. 将图片的渲染模式设为原始。



2. 如果您以编程方式执行屏幕，请将以下类分配给Storyboard中的UITabBarController或作为基类。

1. Make your images' rendering mode as Original.

2. Assign this class below to your UITabBarController in your Storyboard or as your base class if you're doing your screen programmatically.

//
//  BaseTabBarController.swift
//  MyApp
//
//  Created by DRC on 1/27/17.
//  Copyright © 2017 PrettyITGirl. All rights reserved.
//

import UIKit

class BaseTabBarController: UITabBarController {

    let numberOfTabs: CGFloat = 4
    let tabBarHeight: CGFloat = 60

    override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated)

        updateSelectionIndicatorImage()
    }

    override func viewWillLayoutSubviews() {
        super.viewWillLayoutSubviews()

        updateSelectionIndicatorImage()
    }

    func updateSelectionIndicatorImage() {
        let width = tabBar.bounds.width
        var selectionImage = UIImage(named:"myimage.png")
        let tabSize = CGSize(width: width/numberOfTabs, height: tabBarHeight)

        UIGraphicsBeginImageContext(tabSize)
        selectionImage?.draw(in: CGRect(x: 0, y: 0, width: tabSize.width, height: tabSize.height))
        selectionImage = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()

        tabBar.selectionIndicatorImage = selectionImage
    }

}

这篇关于自定义标签栏项目背景图片的正确尺寸是多少？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！