Do you know how to achieve the same effect as winamp for android ? I want to do the similar thing. That is when I click on listview, sliding drawer popup. But so far I only can show the sliding drawer in new activity not in the same.
How can I achieve in overlap view. That is when I close the drawer, the layout is show at the front, and the sliding handle is on the layout, when I open the drawer, it covers the main layout.
Any ideas about that ?
Thanks !!
Step #1: Create a RelativeLayout
Step #2: Put the rest of your UI in the RelativeLayout
Step #3: Put the SlidingDrawer in the RelativeLayout as a later child then the rest of the UI (e.g., in layout XML, have it as the last child element of the RelativeLayout)
Children of RelativeLayout (and FrameLayout) stack on top of one another on the Z-axis (i.e., out the face of the screen). Hence, later children will overlap earlier ones. By putting your SlidingDrawer last, it will overlap everything else when opened.
Thank you CommonsWare you helped me,I do not have much reputation to vote up. Here is my sample layout...
I used it.sephiroth.slider.widget.MultiDirectionSlidingDrawer as the SlidingDrawer
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent" android:layout_alignParentLeft="true" android:layout_marginLeft="82dp"
android:layout_alignTop="#+id/button_open">
<Button
android:id="#+id/button_open"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="#string/open"
android:visibility="visible" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New EditText"
android:id="#+id/editText" android:layout_alignParentLeft="true" android:layout_marginLeft="114dp"
android:layout_alignParentTop="true" android:layout_marginTop="6dp"/>
</RelativeLayout>
<it.sephiroth.demo.slider.widget.MultiDirectionSlidingDrawer
xmlns:panel="http://schemas.android.com/apk/res/it.sephiroth.demo.slider"
android:id="#+id/drawer"
panel:direction="topToBottom"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
panel:handle="#+id/handle"
panel:content="#+id/content">
<include
android:id="#id/content"
layout="#layout/pen_content" />
<ImageView
android:id="#id/handle"
android:layout_width="wrap_content"
android:layout_height="40px"
android:src="#drawable/sliding_drawer_handle_bottom" />
</it.sephiroth.demo.slider.widget.MultiDirectionSlidingDrawer>
</RelativeLayout>
Related
Please refer to example below. I want to have the top layout (below encased in red) to be unmoving in a scrollview in my activity. I have a scrollview as the parent layout and then I thought having a relative layout for the top one would work, and align it to the top, but that didn't really work out as it still remained within the scrollview. I would like to have the users have the red-layout box remain static when they scroll down.
I figure I would also have to put in a topMargin at the top of the scrollview or something in order to fit the redbox layout in.
XML Code posted here: http://pastebin.com/bxdREbeG
Do something like this (hand code, for reference only):
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:id="#+id/YourTopStaticView"
android:layout_width="match_parent"
android:layout_height="48dp"> //Or any other height you want
//Contents of the top view
</RelativeLyout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/YourTopStaticView">
//Contents of the ScrollView
</ScrollView>
</RelativeLayout>
As a side note, do not hardcode children into the ScrollView like that. Use the RecyclerView (which is an updated, modern replacement for ListView), which you will be expected to know how to use if you want to move into serious Android programming. It is actually super easy to use, once you get the hang of it :-)
You should use the ScrollView with only one child (official documentation - http://developer.android.com/reference/android/widget/ScrollView.html). According to your xml, your ScrollView is very complicated with a lot of child widgets.
The best option for you is to use a LinearLayout as the root for the whole container, a LinearLayout( or Relative) for the top layout containing the Reset and Save buttons, and a ListView for the long list that you have. ListView takes care of it's own scrolling. So you don't have to worry about that.
This will improve your code performance as well.
This should suit your needs:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout android:id="#+id/topPanel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp">
<TextView android:id="#+id/label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:text="Multi TTS Implementation"/>
<Button android:id="#+id/save"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:text="SAVE"/>
<Button android:id="#+id/resetAll"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#id/save"
android:layout_centerVertical="true"
android:text="RESET ALL"/>
</RelativeLayout>
<ScrollView android:id="#id/scroll"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_below="#id/topPanel"
android:layout_alignParentBottom="true"
android:padding="5dp">
<!-- Your scrollable content here -->
</ScrollView>
</RelativeLayout>
My app currently looks like this:
When I click on a button, the border color changes to green as shown above. I added a scrollview for my list of words as shown on the right side of the image. The problem is that this scrollview covers nearly the entire width of the screen and I am unable to click on the the first three rows of buttons.
A brief description of the layout:
I created a relative layout. The 25 buttons are in this relative layout. Then also within the relative layout I created a scrollable linear layout containing 20 textviews
Can someone please help me fix this layout? I want to be able to click on all the buttons and have the scrollview not block the buttons.
And I thought it might be a good idea to put the 25 buttons in its own relative layout within the main relative layout. Does anyone know how I can do that without redoing the entire layout?
Also, if you guys have any advice on the correct way to code the layout please let me know. I am fairly knew to android programming and don't know if I should use relative layout vs linear layout vs frame layout or match_parent vs fill_parent vs wrap_content. Please let me know if I am misusing any of them.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".Game" >
<Button
android:id="#+id/button1"
android:layout_width="#dimen/size"
android:layout_height="#dimen/size"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="18dp"
android:background="#drawable/button"
android:onClick="ButtonOnClick" />
.
. (Buttons 2 - 24)
.
<Button
android:id="#+id/button25"
android:layout_width="#dimen/size"
android:layout_height="#dimen/size"
android:layout_alignBaseline="#+id/button24"
android:layout_alignBottom="#+id/button24"
android:layout_alignLeft="#+id/button20"
android:background="#drawable/button"
android:onClick="ButtonOnClick" />
<ScrollView
android:id="#+id/scrollable"
android:layout_width="wrap_content"
android:layout_height="150dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:scrollbars="vertical" >
<LinearLayout
android:id="#+id/ll"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="300dp"
android:layout_marginTop="20dp"
android:orientation="vertical" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/word1" />
.
. (TextViews 2 - 19)
.
<TextView
android:id="#+id/textView20"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/word20" />
</LinearLayout>
</ScrollView>
</RelativeLayout>
Use a LinearLayout instead of RelativeLayout as your top layout and make it android:orientation="horizontal".
Then put all of your buttons in a RelativeLayout with an android:layout_weight="1" and android:layout_width="0dp".
Also put the ScrollView in a second RelativeLayout with a width of "wrap_content".
Here is the structure:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<RelativeLayout
android:layout_widtht="0dp"
android:layout_heigh="fill_parent"
android:layout_weight="1">
All buttons go here...
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="fill_parent">
Scroll view goes here...
</RelativeLayout>
</LinearLayout>
I have a layout xml file:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#000000" >
<FrameLayout
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:layout_above="#+id/taoFooter">
<com.example.gamedice.DrawingPanel
android:id="#+id/taoCanvas"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:background="#000000" />
</FrameLayout>
<LinearLayout
android:id="#+id/taoFooter"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
style="#android:style/Holo.ButtonBar">
<Button
android:id="#+id/roll1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="#string/roll1"
android:layout_weight="1"
style="#android:style/Widget.Holo.Button.Borderless"
android:onClick="rollTaoDice" />
<Button
android:id="#+id/roll2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="#string/roll2"
android:layout_weight="1"
style="#android:style/Widget.Holo.Button.Borderless"
android:onClick="rollTaoDice" />
<Button
android:id="#+id/roll3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="#string/roll3"
android:layout_weight="1"
style="#android:style/Widget.Holo.Button.Borderless"
android:onClick="rollTaoDice" />
<Button
android:id="#+id/roll4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="#string/roll4"
android:layout_weight="1"
style="#android:style/Widget.Holo.Button.Borderless"
android:onClick="rollTaoDice" />
</LinearLayout>
</RelativeLayout>
In addition to other items in the layout, this layout has a button bar consisting of four buttons at the bottom of the screen. Based on user input, I want to be able to replace this button bar with another predefined set of buttons, and then be able to change back later.
Since I know what the alternate set of buttons will be ahead of time, I thought it might be possible to use an alternate layout xml file, but I couldn't figure out how to do that. Can anyone give me some guidance?
You can add your second set of buttons in a layout like you did with the first, then in the layout xml file set the attribute android:visibility="gone" on the second layout. In your code you can call setVisibility(View.GONE) for one layout (e.g. taoFooter) and setVisibility(View.VISIBLE) on the other layout when you need to switch the buttons out.
Alternatively, if you easily want to add some animations you can add a ViewFlipper around your two alternate button layouts. Only the first one is visible by default. You can switch to the next layout with showNext(). Add calls to setInAnimation() and setOutAnimation() before that to enable the animations.
I have a button and a expand list above this button , when the list is expanded the button below it disappears . how to make this button in fixed location?
<?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">
<include layout="#layout/ads_bar" ></include>
<TextView
android:text="Level 1:"
android:textSize="20dp"
android:id="#+id/TextView01"
android:layout_width="fill_parent"
android:layout_height="wrap_content"></TextView>
<TextView
android:text="lorem ispum something about this level ..... :)"
android:textSize="16dp"
android:id="#+id/TextView01"
android:layout_width="fill_parent"
android:layout_height="wrap_content"></TextView>
<ExpandableListView
android:id="#+id/listView"
android:scrollbars="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"></ExpandableListView>
<include
android:layout_alignParentBottom="true"
layout="#layout/quick_links_bar"></include>
</LinearLayout>
where quick_links_bar represents button !
To acheve button aligned to the bottom it's better to use layout_weight attribute of the linear layout.
Simple example:
<LinearLayout>
<TextView layout_weight=1/>
<Button layout_height="wrap_content"/>
<LinearLayout>
This is better than using RElative layout because if using one you will have the bottom of your text cut off by the button, but in this case it will not happen.
Sounds like you want the quick_links_bar layout to always stay at the bottom? You'll need to use RelativeLayout for that.
Wrap your whole layout in a RelativeLayout and move your quick links bar layout outside of the LinearLayout and set the property android:layout_alignParentBottom="true" on it. For this next bit, you'll need to assign an id to your quick links bar. On your LinearLayout, set the property android:layout_above="#id/quicklinksbarid". Make sure your quick links bar include statement is above the LinearLayout.
I am using following code to display button at the bottom of activity.
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
>
<Button android:id="#+id/btnGetMoreResults"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Get more"
/>
</RelativeLayout>
and listview above it. when i display more data in listview this button pannel is moved down.can any one guide me how can i fix it at the bottom of activity?
any help would be appreciated.
The answer selected as correct is faulty, the button will hide the lower part of the list view. The correct way is to declare the button first and position the list above the button.
<Button android:id="#+id/btnGetMoreResults"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Get more"
android:layout_alignParentBottom="true"/>
<ListView
...
android:layout_above="#id/btnGetMoreResults"/>
The android:layout_alignParentBottom attribute has to be declared in an element of the RelativeLayout not in the RelativeLayout himself (unless there is another RelativeLayout as a parent).
You should do something like this, with the ListView inside the RelativeLayout also :
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true">
<ListView ...>
<Button android:id="#+id/btnGetMoreResults"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Get more"
android:layout_alignParentBottom="true" />
</RelativeLayout>
If you had, for example, all the scrollable elements in a ScrollView, you should do like the following:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
style="#style/rootElement"
>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<!-- texts, buttons, images and anything that you want to scroll -->
</ScrollView>
<LinearLayout
android:orientation="vertical"
style="#style/footer"
android:id="#+id/footer"
android:layout_alignParentBottom="true"
>
</LinearLayout>
</RelativeLayout>
Note that if you want the footer to be fixed, then you shouldn't put it in the ScrollView, where the scrollable content will be placed. Make it child of RelativeLayout and set layout_alignParentBottom to true. Maybe you'll need to add a padding at the bottom of the ScrollView in this case (so that the last element do not get hidden by the footer).
The idea is similar for elements other than ScrollView