ToolBar for Android

I'm an iOS developer new to Titanium. I have an iPhone app that I would like to port to Android as a test case for using Titanium. The opening view of the app is an image with a ToolBar at the bottom. I would like to make the code as cross platform as possible. The attached code produces the correct view in the iPhone emulator but not the Android emulator or device. What am I doing wrong? Thanks for your help.


var win1 = Titanium.UI.createWindow({  
    title:'Tool Bar From Scratch',

var toolBarView = Titanium.UI.createView({

var aButton = Ti.UI.createButton({
    title:'My Sounds',

var bButton = Ti.UI.createButton({
    title:'Soundscape Sounds',

aButton.addEventListener("click", function(e){
    alert(e.source + "Was Clicked");

bButton.addEventListener("click", function(e){
    alert(e.source + "Was Clicked");


var imageView = Titanium.UI.createImageView({


2 Answers

  • Accepted Answer


    Sorry that I only just found your question two months later; you've probably already found the answer?

    I resolved your problem by adding the toolbarView to the window and not the image view.

    For some reason, in Android, nothing will appear on top of an imageView.

    — answered 4 years ago by Chris Dunstall
    1 Comment
    • Chris,

      Thanks for the info. Actually I didn't resolve the issue as I've been on another project but hope to get back to this shortly. It will be great to get this working.


      — commented 4 years ago by William Kautter
  • The problem is that android does not have a native UI component for a toolbar, and hence Titanium cannot map your code to a native widget like it can with iOS. If you look closely at the top right of each API page such as the one for the Toolbar, there is only an apple icon and not an android icon.

    This is the (all too subtle) indication it is only supported on iOS.

    Under Android you have to roll your own view with the look you want.

    — answered 4 years ago by Doug Handy
    • Doug, notice that he actually doesn't create UI component "toolbar" (he only call regular view that way). So, actual error is somewhere else. :)

      — commented 4 years ago by Ivan Škugor
    • Doug,

      Thanks for the response. I thought I did "roll my own". I created a generic view and put two generic buttons in it.


      — commented 4 years ago by William Kautter
    • I realize that should be;, that was a paste error, and also pixel values should be i.e. '200dp' rather than just plain 200. With these changes the results are the same. Any assistance would be greatly appreciated.

      — commented 4 years ago by William Kautter
    • I don't know why I did not get notification comments were added to this 3 hours ago, but just got the notice on this one. Obviously, I did not pay enough attention to the code and just jumped at the "toolbar" in the paragraph saying an iOS app was being ported to android. Sorry about that.

      A few suggestions:

      • For dimensions, do not quote a number unless using a suffix like dp or %, so use 40 instead of '40' (or use '40dp')
      • For width, do not hard code 320. If you want the full width, use both left:0 and right:0 but leave off the width property. That will adjust based on the current device and even orientation changes.

      As you already said, use instead of

      — commented 4 years ago by Doug Handy
    • Doug,

      Thanks for the additional info. Unfortunately none of these changes makes a difference. The toolBar view and the buttons are not visible at all in the Android emulator. These seem like basic UI elements that should work in both environments. Why is that not the case?

      Best regards,


      — commented 4 years ago by William Kautter