ios 如何调整标签栏徽章的位置?

dddzy1tm  于 2023-06-07  发布在  iOS
关注(0)|答案(7)|浏览(312)

我在标签栏上显示徽章,但当数字增加时,它会出现在标签栏项目中,如图所示

我想把徽章视图稍微向左移动,这样它就能适合所选的标签图像。我试着按照描述的here,但没有运气。那么有没有办法调整徽章视图的位置呢?任何帮助将不胜感激。

kuarbcqp

kuarbcqp1#

我发现Kateryna的回答很有用,让我走上了正确的道路,但我不得不稍微更新一下:

func repositionBadge(tab: Int){

    for badgeView in self.tabBarController!.tabBar.subviews[tab].subviews {

        if NSStringFromClass(badgeView.classForCoder) == "_UIBadgeView" {
            badgeView.layer.transform = CATransform3DIdentity
            badgeView.layer.transform = CATransform3DMakeTranslation(-17.0, 1.0, 1.0)
        }
    }

}

请注意,制表符整数不是零索引的,因此第一个制表符将是数字1,第二个数字2,等等。

anhgbhbe

anhgbhbe2#

当您更新您的工卡值时,添加这样的方法:

func updateBadge(#value: UInt, tabBarItemTag: Int) {
     self.viewControllerForTag(tabBarItemTag)?.tabBarItem.badgeValue = value
     for badgeView in (tabBar.subviews[tabBarItemTag] as! UIView).subviews {
         let className = "\(_stdlib_getDemangledTypeName(badgeView))"
         if className.rangeOfString("BadgeView").location != NSNotFound {
             badgeView.layer.transform = CATransform3DIdentity
             badgeView.layer.transform = CATransform3DMakeTranslation(0.0, 10.0, 20.0)
         }
     }
}

您需要使用第二个CATransform 3DMakeTranslation来进行正确的定位。在这段代码中,徽章在底部/左侧移动了一点。首先需要CATransform 3DMakeTranslation来假装徽章移动。这是一个Swift代码,但你可以很容易地将其转换为Objective-C。

b0zn9rqh

b0zn9rqh3#

徽章默认对齐到标签栏图片。如果你添加大图片作为标签栏项目图片,你可以使用下面的代码调整它。

for tabBarButton in self.tabBar.subviews{
        for badgeView in tabBarButton.subviews{
        var className=NSStringFromClass(badgeView.classForCoder)
            if  className == "_UIBadgeView"
            {
                badgeView.layer.transform = CATransform3DIdentity
                badgeView.layer.transform = CATransform3DMakeTranslation(-17.0, 1.0, 1.0)
            }
        }
    }
aamkag61

aamkag614#

在Objective-C中:

for (UIView *tabBarButton in self.navigationController.tabBarController.tabBar.subviews)
    {
        for (UIView *badgeView in tabBarButton.subviews)
        {
            NSString *className = NSStringFromClass([badgeView class]);

            // Looking for _UIBadgeView
            if ([className rangeOfString:@"BadgeView"].location != NSNotFound)
            {
                badgeView.layer.transform = CATransform3DIdentity;
                badgeView.layer.transform = CATransform3DMakeTranslation(-5.0, 1.0, 1.0);
            }
        }
    }
cdmah0mi

cdmah0mi5#

Swift 4、5

我为UITabBar创建了一个扩展,它可以快速获取徽章视图和徽章标签:

extension UITabBar {
    func badgeViewForItem(at index: Int) -> UIView? {
        guard subviews.count > index else {
            return nil
        }
        return subviews[index].subviews.first(where: { NSStringFromClass($0.classForCoder) == "_UIBadgeView" })
    }

    func labelForItem(at index: Int) -> UILabel? {
        guard subviews.count > index else {
            return nil
        }
        return badgeViewForItem(at: index)?.subviews.first(where: { $0 is UILabel }) as? UILabel
    }
}

然后你可以这样做:

let firstItemBadgeView = badgeViewForItem(at: 0)!
// Do something with the badge view like setting the border, background color ...
// ex: firstItemBadgeView.backgroundColor = UIColor.clear
uttx8gqw

uttx8gqw6#

在C# Xamarin

void RepositionBadge(int tab)
{
    foreach (var badgeView in TabBar.Subviews[tab].Subviews)
    {
        if (badgeView.Class.Name == "_UIBadgeView")
        {
            badgeView.Layer.Transform = CATransform3D.Identity;
            badgeView.Layer.Transform = CATransform3D.MakeTranslation(-10.0f, 1.0f, 1.0f);
        }
    }
}
ctrmrzij

ctrmrzij7#

通过将UITabBarItemAppearance对象分配给UITabBarAppearance对象的项目外观属性,并将其分配给tabBar控件的appearance属性,可以更改标记位置。示例:

let itemAppearance = UITabBarItemAppearance()
 itemAppearance.normal.badgePositionAdjustment.horizontal = 10
    
 let appearance = UITabBarAppearance()
 appearance.stackedLayoutAppearance = itemAppearance
 appearance.inlineLayoutAppearance = itemAppearance
 appearance.compactInlineLayoutAppearance = itemAppearance

 tabBar.standardAppearance = appearance

使用iOS 16时,正值似乎会将徽章向左移动 stackedLayoutAppearance,这与文档中的说法相矛盾。

相关问题