简体   繁体   中英

Tab bar icon and title not showing with Storyboard References

I have the following storyboard with a segue to a storyboard reference:

在此处输入图像描述

The problem is that when I run the app, it doesn't show the icon or the title:

在此处输入图像描述

These are the item settings:

在此处输入图像描述

What am I missing?

Here's how to get the tab to show properly:

  1. Put the first UIViewController that will be embedded in the tab in the same storyboard as the UITabViewController. 在此输入图像描述
  2. Ctrl + Drag from the tab bar controller to the content view controller to make the connection as per usual. This will automatically add the UITabBarItem to the bottom of the content view controller. 在此输入图像描述
  3. Select the content view controller.
  4. Click the Editor menu and choose Refactor to Storyboard... 在此输入图像描述

The UITabBarController tab will now point to the new storyboard reference... 在此输入图像描述 ... and the content view controller preserves the UITabBarItem from the tab bar relationship. It will appear normally in the app now. 在此输入图像描述

You can modify image/title of the tab bar item in the initial view controller of the storyboard you are referring to. You just need to add a 'tab bar item' to the initial view controller and change its properties (title/image) accordingly.

  1. Outline view of the root view controller in the referred storyboard

提到故事板的文件大纲

  1. The modified tab bar item in the view controller

初始视图控制器与修改的标签栏项目

Note: the change will not be reflected on the tab bar in the main storyboard; you only see it in the referred storyboard and at runtime.

The problem is that in the target view controller, you don't have a UITabBarItem in the views hierarchy. The TabBarItem is related to the storyboard reference, but should be related to the View Controller.

Looks like a "bug" in Xcode...

To resolve this you can do the following:

  • Just create the segues from the UITabBarController to the Storyboard references.
  • You may configure the Tab Bar Items in the storyboard references, they don't do much more other than showing the tabs in the tab bar on the Storyboard, which is nice for development purposes.

If you now run the app, you will indeed notice that the tabs are missing. To get the tabs to display in the running app as well, do this:

  • Go to the viewcontroller the storyboard reference is referencing to
  • Add a Tab Bar Item into this View Controller by dragging it from the Object Library into the View Controller
  • You will now see a tab bar with one single tab in the view controller
  • Configure the tab bar item to show the correct title and icon

Now run the app and you will now see your tabs.

在界面构建器中,找到对象库中的选项卡栏项

按照故事板引用将Tab Bar项拖动到目标视图控制器中

I tried adding another tab bar, then added tab bar item, selected and image for it BUT Non of above seemed to work with my case .. it was like this : 其他VC选项卡正确显示tabBar图标,但我重构的一个图标缺少其图标

Then i compared it with VC that were working properly with TabBar icons.. 在此输入图像描述

later i found that my navigation items and tab bar items were not together :

Tab栏项目位于导航栏内....我将tabBar项目拖动到HomeVC并放置了NavigationBar项目

Now its working :):)

在此输入图像描述

After struggling with this problem for a few days I found this solution. Double click the storyboard link, which will open the referenced storyboard. In the scene navigator, you can edit the bar item with a custom title and icon. Works in xCode 9.

Storyboard

Scene Navigator

I had this exact same issue and neither of the above answers worked in my case. I solved by setting my tab bar image in the image bar item section inside the storyboard's reference like shown in the attached image:


在此输入图像描述

I made following in the storyboard and made class for each UINavigationController and made following code in each UINavigationController class

override func viewDidLoad() {
        super.viewDidLoad()
        let someController = StoryboardManager.surveyStoryboard.instantiateViewControllerWithIdentifier("SomeController") as! SomeController
        viewControllers = [someController]
        // Do any additional setup after loading the view.
    }

在此输入图像描述

I did it in different way. My fourth tab was not showing. I just programmatically placed image on its place. You need to set its X,Y coordinates accordingly.

    let imageName = "video"
    let image = UIImage(named: imageName)
    let imageView = UIImageView(image: image!)
    imageView.frame = CGRect(x: view.frame.width - 80, y:  view.frame.height-70, width: 50, height: 50)
    view.addSubview(imageView)

在此处输入图片说明

Just add a Tab Bar Item in the "child" view controller:

在此处输入图像描述

this works for me

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM