将UILabel添加到UIToolbar


97

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

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];

Answers:


128

看看这个

[[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
请注意,如果您选择走这条路线,则必须正确设置标签样式(label.backgroundColor = [UIColor clearColor]等)。您还可以将UIBarButtonItem初始化为普通样式,这将为您提供类似的外观
wisequark

我知道这是一篇非常古老的文章,但是我对此问题有疑问。完成此操作后,以后是否有任何方法可以访问titleLabel进行更改,或者由于所有内容都已发布而不可能吗?
瑞安

Ryan,UILabel可能仍然存在-它是self.titleLabel。此示例需要为UILabel * titleLabel声明并合成的属性,但是未显示该代码。如果您有权访问运行此代码的对象(可能是UIViewController),则可以访问其titleLabel。例如,您可以在视图控制器上添加一个方法,传递所需的新标题,然后调用[self.titleLabel setText:newTitle]。
史蒂夫·里德尔

7
您是否不想在标题按钮栏项之后添加第二个分隔符?
2012年

121

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

要向中添加UILabelUIToolBar您需要在IB中拖动一个新对象,UIView从而向UIToolBarIB中添加一个通用对象。将自动创建一个将使用您的自定义初始化的。接下来,向中添加一个,然后以图形方式进行编辑以匹配您的首选样式。然后,您可以根据需要直观地设置固定和/或可变垫片,以适当地放置您的垫片。UIViewUIToolBarIBUIBarButtonItemUIViewUILabelUIViewUILabelUILabel

您还必须设置两个背景UILabelUIViewclearColor获得UIToolBar下正确显示通过UILabel


2
妙招,不知道您可以在Interface Builder中完成。非常感谢你。
2011年

有没有一种方法可以使用该方法添加带有自定义图像的UIButton?我可以添加UIButton,但是图像不会显示。
cannyboy 2011年

4
我似乎无法使它正常工作。当我将UIView拖到工具栏上时,它最终被放置在视图控制器中,而不是工具栏上。另外,我们是在导航控制器还是在视图控制器中执行此操作?
guptron

1
这似乎不起作用。如果它很久以前就起作用了,那么在XCode 6中就不再有用了
–FrédéricAdda 2014年

1
您应该更新答案以指出这仅适用于手动添加到视图控制器中的工具栏。它不适用于为您添加的工具栏。
詹姆斯·布什

32

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

  • 创建一个UIBarButtonItem并将其添加到Interface Builder中的工具栏

在此处输入图片说明

  • 取消选中此BarButtonItem的“已启用”

在此处输入图片说明

  • 将此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() 

结果:

在此处输入图片说明

lastUpdateLabel.sizetoFit()每次更新标签文本时,您都必须致电


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

6

一个我用这一招的事情是实例化一个UIActivityIndicatorView在顶部UIToolBar的东西,否则是不可能的。例如,在这里,我有一个UIToolBar2 UIBarButtonItem,一个a FlexibleSpaceBarButtonItem,然后另一个UIBarButtonItem。我想插入UIActivityIndicatorViewUIToolBar灵活空间和最终(右手)按钮之间。所以在我RootViewController下面,

- (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];}

此代码泄漏使用自定义活动指示器视图为UIBarButtonItem分配的内存。(它还漏活动指示灯的记忆,但我认为被释放的代码片段末端以下的。
erikprice

3

细节

  • Xcode 10.2.1(10E1001),Swift 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) }
}

结果

在此处输入图片说明


我喜欢这个,但是如果我有TableView,那么它将随此栏滚动。我该如何解决?
Maksim Kniazev'3

你好,马克西姆,我听不懂你的问题。请描述您想要获得的结果。
瓦西里·博德纳丘克

好的,我正在使用UITableViewController,如果我设置view.addSubview(toolBar!)并滚动tableview,则该条将与tableView一起滚动,我希望它具有固定的底部位置
Maksim Kniazev,

我认为,应该将UIViewController与UITableView(而不是UITableViewController)一起用作子视图。
瓦西里·博德纳丘克

好吧 我会尝试的
Maksim Kniazev '18

2

类似于Matt RI使用的界面生成器。但是我想改为使用1 UIWebView,以便我可以将一些文本加粗,而将其他文本不加粗(例如邮件应用程序)。所以

  1. 而是添加webview。
  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

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

[self.navigationController.tabBarController.view addSubview:yourView];

1

试试这个:

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.barItem是一个UIBarButtonItem从对象库添加的,放置在两个灵活空间之间。

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

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.