I want to have a common bottom bar in Android. If any of the button is clicked then it should open up the new activity with bottom bar still at the bottom. Is there any way to achieve this? I have tried having a superclass with 4 buttons at the bottom and then opening new activity on click event but I do not know why the bottom bar is not displayed and also is this is the proper approach?
The way I did this was to have a single Activity consisting of a ViewFlipper which occupied most of the window, and the button bar at the bottom. The child "activities" were simply children of the ViewFlipper. Worked fine.
EXAMPLE ADDED LATER:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
>
<ViewFlipper
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
>
<!-- Your pages go here, i.e.: -->
<include android:id="#+id/page1" layout="#layout/page1" />
<include android:id="#+id/page2" layout="#layout/page2" />
...
</ViewFlipper>
<!-- Your bottom bar -->
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
... buttons or whatever you want here ...
</LinearLayout>
</LinearLayout>
Related
I have three controls arranged vertically, List View, Menu Button and Hidden Menu.
List view will occupy the whole screen and menu button will be stick to the bottom of the screen. When we touch menu button, hidden menu will slide up and will occupy the almost half screen. Hidden menu will not cover the whole screen.
What layouts can I use and how to arrange?
Added Extra Info.
Below is my test xml layouts. If I send off-screen for my sub menu, the list data is not loaded, i think it's because it's not displayed on screen.
<RelativeLayout
android:id="#+id/content_layout"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="#+id/header_layout"
android:background="#ffffff" >
<ExpandableListView
android:id="#+id/listview_Category"
android:layout_width="match_parent"
android:layout_height="500dp"
android:divider="#E5E5E5"
android:dividerHeight="1dp"
android:background="#aaaaaa"
tools:listitem="#layout/list_item"
>
</ExpandableListView>
<ImageButton
android:id="#+id/imageButtonMenu"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
android:layout_gravity="center_horizontal"
android:contentDescription="#string/app_name"
android:src="#drawable/menu_icon" />
<ListView
android:id="#+id/listview_Cat"
android:layout_width="match_parent"
android:layout_height="500dp"
android:layout_toEndOf="#+id/imageButtonMenu"
android:background="#777777"
android:divider="#ffffff"
android:dividerHeight="1dp"
android:translationY="500dp"
tools:listitem="#layout/category_list_item" >
</ListView>
</RelativeLayout>
You can use a Frame Layout in which the list view covers the whole layout and the menu button is bottom aligned and the menu has a fixed width and height...
but since it is a sliding menu you are looking for you can also use Navigation Drawer introduced in the latest version of android.
i am designing an application which have diff types of functionalies through buttons/image buttons. At final the list might increase. i want to put one custom home button which always keeps on screen when i am in diff activities.
or either if you have any idea about how this Home button is coded to this layout
below screen. please help.
Have you considered the Action Bar which is exactly designed for this purpose?
http://developer.android.com/guide/topics/ui/actionbar.html
While the home button at the bottom can be easily achieved using an image view/button,Using an action Bar is the recommended option.Not only can you link with the home activity but also any other activity of your choice.Refer this to gain a deeper insight.
http://developer.android.com/guide/topics/ui/actionbar.html
http://developer.android.com/reference/android/app/ActionBar.html
You can either place a button/image button/image anything in xml layout and set on click listener on that component. You can also use option menu and give multiple option on all the screens of your application.
Make a layout with a ScrollView on top, and your image-button below the scrollview.
Example:
<!-- language: lang-xml -->
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Your Content Here"
/>
</ScrollView>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"
/>
</LinearLayout>
</LinearLayout>
It looks like this:
I must make a layout with 2 overlapping ScrollViews. One is an article with a "see comments" button. The other view is transparent and contains the comments, and is shown on top of the article when the "see comments" button is clicked. The problem is that when the comments are shown and do not fill the screen, touching the screen out of the screen (eg. below the button "Retour" on the image shown below. This is an iphone screenshot, the design on android is different) scrolls the article.
Also, the "Voir les Commentaires" button can be clicked, even with another layout on top of it.
Why is the view below not disabled (button, scroll...) when there's another one on top of it? How can it be done?
Anybody can help?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:background="#FFFFFF">
<RelativeLayout android:id="#+id/header"
android:layout_width="fill_parent" android:layout_height="49dp"
android:background="#e7e7e8">
<!-- header -->
</RelativeLayout>
<ScrollView android:id="#+id/article_scroll"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:layout_below="#id/header">
<LinearLayout android:layout_width="fill_parent"
android:layout_height="fill_parent" android:orientation="vertical">
<!-- article -->
</LinearLayout>
</ScrollView>
<LinearLayout android:layout_width="fill_parent"
android:layout_below="#id/header" android:layout_height="fill_parent"
android:orientation="vertical" android:background="#50000000" android:visibility="gone">
<ScrollView android:id="#+id/comment_scroll"
android:layout_width="fill_parent" android:layout_height="fill_parent">
<!-- comments -->
</ScrollView>
</LinearLayout>
</RelativeLayout>
You should definitely use a new Activity for your comment and use Transucent theme:
<activity android:theme="#android:style/Theme.Translucent">
http://developer.android.com/guide/topics/ui/themes.html
Some alternatives Themes should fit your needs (Dialog for instance)
or a blurried background: http://www.stealthcopter.com/blog/2010/01/android-blurring-and-dimming-background-windows-from-dialogs/
As for the button "Voir les Commentaires", you could set it to enabled = false when the second layer is visible. And I'm not quite sure atm, but I think you can do the same for the bottom ScrollView.
How to add a separator between menu items in ActionBar likewise it's made in Gmail app?
Well when I was trying to make my own action bar I used a black FrameLayout in which all the items of the action bar will be displayed. I set the layout_margin attribute on each item at 1dp so it would appear like there was a black separator on either side - if you want it to be larger you can increase the margin.
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#000000">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageButton ....... />
<ImageButton ...... android:layout_marginLeft="1dp"/> <!-- this will be shown as a separator-->
</LinearLayout>
</FrameLayout>
I have a FrameLayout wiht a ScrollView and a LinearLayout inside.
Both ScrollView and LinearLayout have the same dimensions, so they are overlaid and the LinearLayout covers and hides the ScrollView.
The ScrollView has TextView and a Button inside itself.
This is the situation:
+FrameLayout
+ScrollView
+ LinearLayout 1
+ TextView
+ Button
+LinearLayout 2
Sometimes the LinearLayout2, which is on the top, is animated and goes out of the screen. For layout reasons I can't set it to GONE and this is the problem.
After the animation ends, the ScrollView is shown and I need to interact with the ScrollView, for example clicking the button and obviously scrolling, but all the events are always caught by the LinearLayout 2, because it always has the Visibility set to VISIBLE even if is actually hide out of the screen.
So, how can I pass the touch event down to the scrollview and its children?``
** EDIT **
This my XML. So you can understand better.
Which is the idea?
This layout is composed by 4 sliding drawer. When the user clicks on one of them, the drawer clicked goes up with animation and becomes a kind of header, the others go down out of the screen and they hide and the scrollview is visible ready to interact with the user.
For example: I click the second drawer, the third goes down, the disclaimer, the first goes up out of the screen and the second, which has been clicked goes at the top of the scree as an header. If I click again the second drawer, which is on the top now, I restore the initial layout as at the beginning, always with animation. To do that I add a Trasparent Layout, which has the same dimension of a drawer on the top, to handle click event, so I avoid to set a new layout whenever I animate the drawers.
What I want is to interact with the scrollview when it becomes visible and with all the stuff inside it.
PROBLEM: I can't set the drawers to GONE because the wieght parameter influences their height, but only to INVISIBLE. So, how can interact with the scrollview below?
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/programma_layout_root"
android:layout_width="fill_parent" android:layout_height="fill_parent">
<!-- SCROLLVIEW HIDDEN FIRST LAYER -->
<ScrollView android:id="#+id/programma_content_scroll" android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="top">
<LinearLayout android:id="#+id/programma_layout_disclaimer_content"
android:layout_height="fill_parent" android:layout_width="fill_parent"
android:orientation="vertical" android:visibility="invisible">
<TextView android:id="#+id/programma_layout_disclaimer_content_text"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:text="some text..." />
<Button android:id="#+id/programma_layout_disclaimer_content_button"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_gravity="center|bottom" android:text="CLICK" />
</LinearLayout>
</ScrollView>
<!-- LAYOUT FOREGROUND SECOND LAYER -->
<LinearLayout android:id="#+id/programma_layout_container"
android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"
android:weightSum="19">
<include android:id="#+id/header_placeholder" layout="#layout/header" />
<!-- DISCLAIMER DRAWER -->
<RelativeLayout android:id="#+id/programma_layout_disclaimer"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:layout_weight="4" >
</RelativeLayout>
<!-- FIRST DRAWER -->
<RelativeLayout android:id="#+id/programma_layout_first"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:layout_weight="5" android:visibility="visible"
>
<!-- some stuff here (text, image...) -->
</RelativeLayout>
<!-- SECOND DRAWER -->
<RelativeLayout android:id="#+id/programma_layout_second"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:layout_weight="5"
>
<!-- some stuff here (text, image...) -->
</RelativeLayout>
<!-- THIRD DRAWER -->
<RelativeLayout android:id="#+id/programma_layout_third"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:layout_weight="5" >
<!-- some stuff here (text, image...) -->
</RelativeLayout>
</LinearLayout>
<include android:id="#+id/header" layout="#layout/header"
android:layout_gravity="top" />
</FrameLayout>