如何在Xcode中左对齐导航栏的标题?

时间:2017-06-12 18:21:43

标签: swift xcode uinavigationbar

为了让导航栏的标题左对齐,我一直在尝试以下操作:

AppDelegate.swift文件中:

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
    // Override point for customization after application launch.


    UINavigationBar.appearance().barTintColor = UIColor.red
    UINavigationBar.appearance().titleTextAttributes = [NSForegroundColorAttributeName:
        UIColor.white]
    return true
}

TableViewController.swift文件中:

override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)
        self.navigationController?.navigationBar.topItem?.title = "Home"
    }

但我找不到任何解决问题的方法。我还尝试了以下我在这里找不到的内容:

AppDelegate.swift文件中:

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
    // Override point for customization after application launch.


    UINavigationBar.appearance().barTintColor = UIColor.red
    UINavigationBar.appearance().titleTextAttributes = [NSForegroundColorAttributeName:
        UIColor.white]
let lbNavTitle = UILabel (frame: CGRect(x: 0, y: 40, width: 320, height: 40))
    lbNavTitle.center = CGPoint(x: 160, y: 285)
    lbNavTitle.textAlignment = .left
    lbNavTitle.text = "Home"
    self.navigationItem.titleView = lbNavTitle

TableViewController.swift文件中:

override func viewDidAppear(_ animated: Bool) {
    super.viewDidAppear(animated)
    self.navigationController?.navigationBar.topItem?.title = "Home"
    let lbNavTitle = UILabel (frame: CGRect(x: 0, y: 0, width: 320, height: 40))
    lbNavTitle.backgroundColor = UIColor.red
    lbNavTitle.textColor = UIColor.black
    lbNavTitle.numberOfLines = 0
    lbNavTitle.center = CGPoint(x: 0, y: 0)
    lbNavTitle.textAlignment = .left
    lbNavTitle.text = "Home"

    let string = NSMutableAttributedString ("Title/nSubTitle")

    self.navigationItem.titleView = lbNavTitle
}

3 个答案:

答案 0 :(得分:10)

let label = UILabel()
label.textColor = UIColor.white
label.text = "TCO_choose_reminder".localized;
self.navigationItem.leftBarButtonItem = UIBarButtonItem.init(customView: label)

我使用获取UIView的构造函数初始化一个UIBarButtonItem,并将我想要的标签设置为参数以获取以下内容。

enter image description here

答案 1 :(得分:9)

您可以使用navigationItems titleView添加左对齐的UILabel,然后使用自动布局设置其框架,如下所示:

let label = UILabel()
label.text = "Title Label"
label.textAlignment = .left
self.navigationItem.titleView = label
label.translatesAutoresizingMaskIntoConstraints = false
label.superview?.addConstraint(NSLayoutConstraint(item: label, attribute: .centerX, relatedBy: .equal, toItem: label.superview, attribute: .centerX, multiplier: 1, constant: 0))
label.superview?.addConstraint(NSLayoutConstraint(item: label, attribute: .width, relatedBy: .equal, toItem: label.superview, attribute: .width, multiplier: 1, constant: 0))
label.superview?.addConstraint(NSLayoutConstraint(item: label, attribute: .centerY, relatedBy: .equal, toItem: label.superview, attribute: .centerY, multiplier: 1, constant: 0))
label.superview?.addConstraint(NSLayoutConstraint(item: label, attribute: .height, relatedBy: .equal, toItem: label.superview, attribute: .height, multiplier: 1, constant: 0))

答案 2 :(得分:2)

好吧,如果您想使用大标题,则默认为左对齐。

对于整个导航层次结构。

import React, { Component, Fragment } from 'react';
import { connect } from 'react-redux';

class tryout extends Component {
    constructor(props) {
      super(props);
      this.state = {
        data: [],
        message: '',
        quiz_taker: null,
        question: null,
        answer: null,
        
      }
    }
  
    componentDidMount() {
      
      const token = this.props.token;
      const API_URL = "/api/quizzes/testquiz";
      const configs = {
        method: 'GET',
        headers: {'Authorization': `Token ${token}`}
      }
  
      fetch(API_URL, configs)
      .then(response => {
        if (response.status > 400) {
          return this.setState(() => ({message: 'Something went wrong'}))
        } return response.json();
      })
      .then(data => {
        this.setState(() => ({data: data,
          message: 'Success'}))
      })
     
    }
  
    render() {
      const details = this.state.data.quiz.question_set[0].label
      console.log(details);
      
      return (
        <div>test</div>
        
      )
      
     }
   }
   export default connect((state) => ({token: state.auth.token}))(tryout);

对于 1 个视图控制器

navigationController?.navigationBar.prefersLargeTitles = true