Board index » Android Tutorials with Source Code » Novice Tutorials

Skip to content

MenuBar

Basic Tutorials concerning: GUI, Views, Activites, XML, Layouts, Intents, ...
Post a reply

MenuBar

Postby ub » Thu May 14, 2009 3:24 pm

Hi,

I want to code a menubar simular to phonebook:
Image

I made my own custom solution so far. Every time a button in the menubar is clicked, the content of a certain layer is changed.

Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1.  
  2. //remove all existing view from content layer
  3.  
  4. view.removeAllViews();
  5.  
  6. view.addView( content = new MessageScreenView( view.getContext() ), new LinearLayout.LayoutParams( LinearLayout.LayoutParams.FILL_PARENT, LinearLayout.LayoutParams.FILL_PARENT ) );
  7.  
  8.  
Parsed in 0.030 seconds, using GeSHi 1.0.8.4


The solution works fine so far, but I am not sure if I should extend a tabhost oder something else to realise my needs.

How would you code a menubar shown in the picture above?

Thanks.
ub
Freshman
Freshman
 
Posts: 2
Joined: Thu May 14, 2009 3:11 pm
Top
Top

Excellent menu

Postby makrandmane » Mon May 18, 2009 12:50 pm

Excellent menu bar , can u put some code here , or some guide lines how to create menus ?
makrandmane
Junior Developer
Junior Developer
 
Posts: 11
Joined: Mon Mar 23, 2009 1:07 pm
Top

Postby SlumberMachine » Tue May 19, 2009 7:51 pm

Could that "menubar" possibly be just a bunch of buttons set to be located next to each other on the bottom of the screen? It doesn't sound to hard to do that.

You would just need to add in the buttons in the "main.xml" and make sure to add in the layout info.
Here is one button:
Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1.    <Button android:id="@+id/one"
  2.  
  3.    android:layout_width="100px"
  4.  
  5.    android:layout_height="100px"
  6.  
  7.    android:layout_alignParentRight="true"
  8.  
  9.    android:layout_marginLeft="2px"
  10.  
  11.    android:layout_marginTop="250px"
  12.  
  13.    android:layout_marginRight="200px"
  14.  
  15.    android:background="@drawable/Your_button_pic_here"
  16.  
  17.    android:text=" "
  18.  
  19.    android:textSize="70px"/>
Parsed in 0.001 seconds, using GeSHi 1.0.8.4


place your button picture in the drawable folder and set it in the "android:background" area above.

Here is an example that I made in droiddraw (its a windows Android UI generator), it basically the same as above, except its missing the button graphics, done in landscape, and has a lot more buttons:

Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1. <?xml version="1.0" encoding="utf-8"?>
  2.  
  3. <AbsoluteLayout
  4.  
  5. android:id="@+id/widget0"
  6.  
  7. android:layout_width="fill_parent"
  8.  
  9. android:layout_height="fill_parent"
  10.  
  11. xmlns:android="http://schemas.android.com/apk/res/android"
  12.  
  13. >
  14.  
  15. <Button
  16.  
  17. android:id="@+id/widget28"
  18.  
  19. android:layout_width="wrap_content"
  20.  
  21. android:layout_height="wrap_content"
  22.  
  23. android:text="Button"
  24.  
  25. android:layout_x="0px"
  26.  
  27. android:layout_y="212px"
  28.  
  29. >
  30.  
  31. </Button>
  32.  
  33. <Button
  34.  
  35. android:id="@+id/widget29"
  36.  
  37. android:layout_width="wrap_content"
  38.  
  39. android:layout_height="wrap_content"
  40.  
  41. android:text="Button"
  42.  
  43. android:layout_x="60px"
  44.  
  45. android:layout_y="212px"
  46.  
  47. >
  48.  
  49. </Button>
  50.  
  51. <Button
  52.  
  53. android:id="@+id/widget30"
  54.  
  55. android:layout_width="wrap_content"
  56.  
  57. android:layout_height="wrap_content"
  58.  
  59. android:text="Button"
  60.  
  61. android:layout_x="120px"
  62.  
  63. android:layout_y="212px"
  64.  
  65. >
  66.  
  67. </Button>
  68.  
  69. <Button
  70.  
  71. android:id="@+id/widget31"
  72.  
  73. android:layout_width="wrap_content"
  74.  
  75. android:layout_height="wrap_content"
  76.  
  77. android:text="Button"
  78.  
  79. android:layout_x="180px"
  80.  
  81. android:layout_y="212px"
  82.  
  83. >
  84.  
  85. </Button>
  86.  
  87. <Button
  88.  
  89. android:id="@+id/widget32"
  90.  
  91. android:layout_width="wrap_content"
  92.  
  93. android:layout_height="wrap_content"
  94.  
  95. android:text="Button"
  96.  
  97. android:layout_x="240px"
  98.  
  99. android:layout_y="212px"
  100.  
  101. >
  102.  
  103. </Button>
  104.  
  105. <Button
  106.  
  107. android:id="@+id/widget33"
  108.  
  109. android:layout_width="wrap_content"
  110.  
  111. android:layout_height="wrap_content"
  112.  
  113. android:text="Button"
  114.  
  115. android:layout_x="300px"
  116.  
  117. android:layout_y="212px"
  118.  
  119. >
  120.  
  121. </Button>
  122.  
  123. <Button
  124.  
  125. android:id="@+id/widget34"
  126.  
  127. android:layout_width="wrap_content"
  128.  
  129. android:layout_height="wrap_content"
  130.  
  131. android:text="Button"
  132.  
  133. android:layout_x="360px"
  134.  
  135. android:layout_y="212px"
  136.  
  137. >
  138.  
  139. </Button>
  140.  
  141. <Button
  142.  
  143. android:id="@+id/widget35"
  144.  
  145. android:layout_width="wrap_content"
  146.  
  147. android:layout_height="wrap_content"
  148.  
  149. android:text="Button"
  150.  
  151. android:layout_x="420px"
  152.  
  153. android:layout_y="212px"
  154.  
  155. >
  156.  
  157. </Button>
  158.  
  159. </AbsoluteLayout>
Parsed in 0.008 seconds, using GeSHi 1.0.8.4
SlumberMachine
Developer
Developer
 
Posts: 39
Joined: Tue Feb 24, 2009 9:00 pm
Top
Top
Post a reply

Return to Novice Tutorials

Who is online

Users browsing this forum: No registered users and 9 guests

Board index The team • Delete all board cookies • All times are UTC + 1 hour