将 UILabel 添加到 UIToolbar

Adding a UILabel to a UIToolbar

提问人: 提问时间:12/2/2008 最后编辑:7 revs, 5 users 65%user8359 更新时间:8/11/2021 访问量:99233

问:

我正在尝试向工具栏添加标签。按钮效果很好,但是当我添加标签对象时,它会崩溃。有什么想法吗?

UIBarButtonItem *setDateRangeButton = [[UIBarButtonItem alloc] initWithTitle:@"Set date range"
                                                                       style:UIBarButtonItemStyleBordered
                                                                      target:self
                                                                      action:@selector(setDateRangeClicked:)];

UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(5, 5, 20, 20)];
label.text = @"test";

[toolbar setItems:[NSArray arrayWithObjects:setDateRangeButton,label, nil]];

// Add the toolbar as a subview to the navigation controller.
[self.navigationController.view addSubview:toolbar];

// Reload the table view
[self.tableView reloadData];
iOS iPhone UIBARBUTTONITEM

评论


答:

129赞 3 revs, 3 users 73%Answerbot #1

看看这个

[[UIBarButtonItem alloc] initWithCustomView:yourCustomView];

基本上,每个项目都必须是一个“按钮”,但它们可以使用您需要的任何视图进行实例化。下面是一些示例代码。请注意,由于其他按钮通常位于工具栏上,因此在标题按钮的每一侧都放置了间隔符,使其保持居中。

NSMutableArray *items = [[self.toolbar items] mutableCopy];

UIBarButtonItem *spacer = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil];
[items addObject:spacer];
[spacer release];

self.titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(0.0 , 11.0f, self.view.frame.size.width, 21.0f)];
[self.titleLabel setFont:[UIFont fontWithName:@"Helvetica-Bold" size:18]];
[self.titleLabel setBackgroundColor:[UIColor clearColor]];
[self.titleLabel setTextColor:[UIColor colorWithRed:157.0/255.0 green:157.0/255.0 blue:157.0/255.0 alpha:1.0]];
[self.titleLabel setText:@"Title"];
[self.titleLabel setTextAlignment:NSTextAlignmentCenter];

UIBarButtonItem *spacer2 = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil];
[items addObject:spacer2];
[spacer2 release];

UIBarButtonItem *title = [[UIBarButtonItem alloc] initWithCustomView:self.titleLabel];
[items addObject:title];
[title release];

[self.toolbar setItems:items animated:YES];
[items release];

评论

10赞 wisequark 12/3/2008
请注意,如果您选择走这条路线,则必须适当地设置标签样式(label.backgroundColor = [UIColor clearColor] 等)。还可以初始化一个 UIBarButtonItem 的样式为 Plain,这将为你提供类似的外观
0赞 Ryan 11/29/2011
我知道这是一个非常古老的帖子,但我对这个答案有疑问。完成此操作后,是否有任何方法可以稍后访问 titleLabel 来更改它,或者由于所有内容都已发布而无法更改?
0赞 Steve Liddle 12/3/2011
Ryan,UILabel 可能仍然存在——它是 self.titleLabel。此示例需要为 UILabel *titleLabel 声明和合成一个属性,但未显示该代码。如果有权访问运行此代码的对象(可能是 UIViewController),则可以访问其 titleLabel。例如,您可以在视图控制器上添加一个方法,传入所需的新标题,然后调用 [self.titleLabel setText:newTitle]。
7赞 len 10/24/2012
难道您不希望在标题按钮栏项之后添加第二个分隔符吗?
6赞 2 revs, 2 users 90%Alasdair Allan #2

我使用这个技巧做的一件事是在 之上实例化一个,否则这是不可能的。例如,这里我有一个 2 , a ,然后是另一个 .我想在弹性空间和最后一个(右侧)按钮之间插入一个。所以在我的中,我做了以下几点,UIActivityIndicatorViewUIToolBarUIToolBarUIBarButtonItemFlexibleSpaceBarButtonItemUIBarButtonItemUIActivityIndicatorViewUIToolBarRootViewController

- (void)viewDidLoad {
[super viewDidLoad];// Add an invisible UIActivityViewIndicator to the toolbar
UIToolbar *toolbar = (UIToolbar *)[self.view viewWithTag:767];
NSArray *items = [toolbar items];

activityIndicator = [[UIActivityIndicatorView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 20.0f, 20.0f)];
[activityIndicator setActivityIndicatorViewStyle:UIActivityIndicatorViewStyleWhite];    

NSArray *newItems = [NSArray arrayWithObjects:[items objectAtIndex:0],[items objectAtIndex:1],[items objectAtIndex:2],
                     [[UIBarButtonItem alloc] initWithCustomView:activityIndicator], [items objectAtIndex:3],nil];
[toolbar setItems:newItems];}

评论

0赞 erikprice 5/20/2011
此代码泄漏为具有自定义活动指示器视图的 UIBarButtonItem 分配的内存。(它还会泄漏活动指示器的内存,但我认为它是在代码片段末尾下方发布的。
121赞 2 revs, 2 users 73%Matt R #3

对于那些使用Interface Builder进行布局的用户,也可以单独使用Interface Builder来执行此操作。UIToolBar

要向 a 添加 a,您需要通过将新对象拖到 . 将自动创建一个将使用您的自定义 .接下来,将 a 添加到图形中,并以图形方式进行编辑以匹配您喜欢的样式。然后,您可以根据需要直观地设置固定和/或可变垫片,以适当地定位您的垫片。UILabelUIToolBarUIViewUIToolBarUIViewUIToolBarIBUIBarButtonItemUIViewUILabelUIViewUILabelUILabel

您还必须设置 和 to 的背景,才能在 .UILabelUIViewclearColorUIToolBarUILabel

评论

2赞 Rafael Bugajewski 1/11/2011
不错的技巧,不知道您可以在Interface Builder中做到这一点。谢谢。
0赞 cannyboy 3/30/2011
有没有办法使用该方法添加带有自定义图像的 UIButton?我可以添加一个 UIButton,但图像没有显示出来。
4赞 abc123 3/26/2013
我似乎无法让它工作。当我将 UIView 拖动到工具栏上时,它最终被放置在视图控制器内,而不是工具栏上。另外,我们是在导航控制器中还是在视图控制器中执行此操作?
1赞 Frederic Adda 9/4/2014
这似乎行不通。如果它很久以前就工作过一次,那么在 XCode 6 中就不再工作了......
1赞 James Bush 1/21/2018
您应该更新您的答案,以指出这仅适用于手动添加到视图控制器的工具栏;它不适用于为您添加的工具栏。
2赞 3 revs, 2 users 91%Todd Horst #4

与 Matt R 类似,我使用了界面构建器。但是我想在里面放 1,这样我就可以将一些文本加粗而其他文本不加粗(如邮件应用程序)。所以UIWebView

  1. 改为添加 Web 视图。
  2. 取消选中不透明
  3. 确保背景颜色清晰
  4. 将所有东西连接起来IBOutlet
  5. 使用下面的内容来获得透明的背景,使工具栏闪耀html

法典:

NSString *path = [[NSBundle mainBundle] bundlePath];
NSURL *baseURL = [NSURL fileURLWithPath:path];
NSString *html = [NSString stringWithFormat:@"<html><head><style>body{font-size:11px;text-align:center;background-color:transparent;color:#fff;font-family:helvetica;vertical-align:middle;</style> </head><body><b>Updated</b> 10/11/12 <b>11:09</b> AM</body></html>"];
[myWebView loadHTMLString:html baseURL:baseURL];
1赞 2 revs, 2 users 72%user1938695 #5

试试这个:

UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(140 , 0, 50, 250)];
[label setBackgroundColor:[UIColor clearColor]];
label.text = @"TEXT";
UIView *view = (UIView *) label;
[self.barItem setCustomView:view];

注意:是从对象库中添加的,放置在两个灵活的空间之间。self.barItemUIBarButtonItem

另一种方法是删除线条并更改 (width) 的参数,使其填满整个工具栏,并在代码中自行设置中间对齐方式和字体,[self.barItem setCustom:view]label

1赞 2 revs, 2 users 67%mrhevor #6

如果要在工具栏视图上添加视图,可以尝试以下操作:

[self.navigationController.tabBarController.view addSubview:yourView];
34赞 4 revs, 2 users 93%Frederic Adda #7

我发现 answerBot 的答案非常有用,但我想我在 Interface Builder 中找到了一种更简单的方法:

  • 创建一个 UIBarButtonItem 并将其添加到界面中的工具栏 建筑工人

enter image description here

  • 取消选中此 BarButtonItem 的“enabled”

enter image description here

  • 将此 BarButtonItem 插入到类中的属性(位于 Swift,但在 Obj-C 中非常相似):

    @IBOutlet private weak var lastUpdateButton: UIBarButtonItem! // Dummy barButtonItem whose customView is lastUpdateLabel
    
  • 为 Label 本身添加另一个属性:

    private var lastUpdateLabel = UILabel(frame: CGRectZero)
    
  • 在 viewDidLoad 中,添加以下代码以设置 标签,并将其添加为 BarButtonItem 的 customView

    // Dummy button containing the date of last update
    lastUpdateLabel.sizeToFit()
    lastUpdateLabel.backgroundColor = UIColor.clearColor()
    lastUpdateLabel.textAlignment = .Center
    lastUpdateButton.customView = lastUpdateLabel
    
  • 要更新文本,请执行以下操作:UILabel

    lastUpdateLabel.text = "Updated: 9/12/14, 2:53"
    lastUpdateLabel.sizeToFit() 
    

结果:

enter image description here

每次更新标签文本时都必须调用lastUpdateLabel.sizetoFit()

评论

1赞 Brett Donald 2/23/2015
我创建了一个与您相同的 UIBarButtonItem,将其保持启用状态,并使用以下代码叠加标签:UILabel* label = [[UILabel alloc] init]; label.text = @"Hello"; label.font = [UIFont systemFontOfSize:16]; [label sizeToFit]; self.barItem.customView = label;
4赞 4 revs, 2 users 100%Vasily Bodnarchuk #8

  • Xcode 10.2.1 (10E1001), 斯威夫特 5

完整样本

import UIKit

class ViewController: UIViewController {

    private weak var toolBar: UIToolbar?

    override func viewDidLoad() {
        super.viewDidLoad()

        var bounds =  UIScreen.main.bounds
        let bottomBarWithHeight = CGFloat(44)
        bounds.origin.y = bounds.height - bottomBarWithHeight
        bounds.size.height = bottomBarWithHeight
        let toolBar = UIToolbar(frame: bounds)
        view.addSubview(toolBar)

        var buttons = [UIBarButtonItem]()
        buttons.append(UIBarButtonItem(barButtonSystemItem: .add, target: self, action: #selector(ViewController.action)))
        buttons.append(UIBarButtonItem(barButtonSystemItem: .camera, target: self, action: #selector(ViewController.action)))
        buttons.append(UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil))
        buttons.append(UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil))
        buttons.append(ToolBarTitleItem(text: "\(NSDate())", font: .systemFont(ofSize: 12), color: .lightGray))
        buttons.append(UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil))
        buttons.append(UIBarButtonItem(barButtonSystemItem: .cancel, target: self, action:  #selector(ViewController.action)))
        toolBar.items = buttons

        self.toolBar = toolBar
    }
    @objc func action() { print("action") }
}

class ToolBarTitleItem: UIBarButtonItem {

    init(text: String, font: UIFont, color: UIColor) {
        let label =  UILabel(frame: UIScreen.main.bounds)
        label.text = text
        label.sizeToFit()
        label.font = font
        label.textColor = color
        label.textAlignment = .center
        super.init()
        customView = label
    }
    required init?(coder aDecoder: NSCoder) { super.init(coder: aDecoder) }
}

结果

enter image description here

评论

0赞 Yaroslav Dukal 3/9/2018
我喜欢这个,但是如果我有 TableView,那么它会随着这个栏滚动。我该如何解决这个问题?
0赞 Vasily Bodnarchuk 3/9/2018
你好马克西姆,我无法理解你的问题。请描述您想要获得的结果。
0赞 Yaroslav Dukal 3/9/2018
好的,我正在使用 UITableViewController,如果我设置 view.addSubview(toolBar!) 并滚动我的 tableview,则栏将与 tableView 一起滚动,我希望它有一个固定的底部位置
0赞 Vasily Bodnarchuk 3/9/2018
我认为,您应该将UIViewController与UITableView(而不是UITableViewController)一起使用作为子视图。
0赞 Yaroslav Dukal 3/10/2018
好的spasibo。我会尝试的
0赞 Bassant Ashraf #9

可以使用禁用的 BarButtonItem

let resultsLabel = UIBarButtonItem(title: "number of results", style: .plain, target: self, action: nil)
resultsLabel.isEnabled = false
0赞 2 revsDemented07 #10

Swift 中的解决方案:

执行此操作的一种方法是创建一个视图,然后将其作为自定义视图添加到工具栏中,然后将其添加到工具栏中。 例如:UILabelUIBarButtonItem

    class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        navigationController?.setToolbarHidden(false, animated: false)
        
        let textLabel = UILabel()
        textLabel.font = UIFont.systemFont(ofSize: 17)
        textLabel.text = "Text Label" // Change this to be any string you want
        let textButton = UIBarButtonItem(customView: textLabel)
        let spacer = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil)
        setToolbarItems([spacer, textButton, spacer], animated: false)
    }
    
}

注意: 将标签放在工具栏的中心flexibleSpace

下面是这是什么样子的屏幕截图:Example Screenshot

注意:如果没有选项卡栏,工具栏将占据屏幕底部。