I'm trying to place a banner at the top of a listview, one that stays there when the list scrolls down. The layout I currently have actually show what I want in the preview but when I run it in the emulator the only thing that appears is the list.
The XML is:
<?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="fill_parent">
<ImageView android:src="#drawable/edinburghcrest"
android:layout_height="wrap_content" android:layout_width="wrap_content"
android:id="#+id/EdUniCrest" android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"></ImageView>
<TextView android:layout_height="wrap_content" android:id="#+id/banner"
android:text="Hotels Nearby" android:textColor="#FFFFFF"
android:gravity="center" android:textSize="20dp" android:layout_width="wrap_content"
android:layout_alignParentTop="true" android:layout_toRightOf="#+id/EdUniCrest"
android:layout_alignParentRight="true" android:layout_alignBottom="#+id/EdUniCrest"
android:background="#25476C"></TextView>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:background="#color/listcolor" android:orientation="vertical" android:layout_marginTop="50dp">
<ListView android:id="#android:id/list" android:layout_width="wrap_content"
android:layout_height="wrap_content">
</ListView>
<TextView android:id="#android:id/empty" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="#string/no_lunchs" />
</LinearLayout>
Anyway, I can't see why it isn't working. Does anyone have any idea what it might be?
Thanks.
The RelativeLayout here just makes it confusing. You can achieve this simply with a couple of LinearLayouts. Wrap your banner in a horizontal layout with a height=wrap_content and set you ListView to height=fill_parent. The list will then fill all available space. The List will scroll independently of the rest of the page.
Something like below should work:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<LinearLayout android:orientation="horizontal" android:id="#+id/bannerBar"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView android:src="#drawable/edinburghcrest"
android:layout_height="wrap_content" android:layout_width="wrap_content"
android:id="#+id/EdUniCrest"/>
<TextView android:layout_height="wrap_content" android:id="#+id/banner"
android:text="Hotels Nearby" android:textColor="#FFFFFF"
android:gravity="center" android:textSize="20dp" android:layout_width="wrap_content"
android:background="#25476C"/>
</LinearLayout>
<ListView android:id="#android:id/list" android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
<TextView android:id="#android:id/empty" android:layout_width="fill_parent"
android:layout_height="fill_parent" android:text="#string/no_lunchs" />
</LinearLayout>
What if you wrapped your RelativeLayout in a ScrollView, and since a ScrollView can only have one child, put the banner above it?
Related
i search lot of topic about scrollview which doesn't scroll but no one can resolve my issue :/
if someone could help me :)
each listview print some people when i do a request from my server
normally when i scroll down of my list the second list appear but it does not
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/selector_for_background_white"
android:orientation="vertical">
<ScrollView
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/selector_for_background_white"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="#+id/layoutScrollResult"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/selector_for_background_white">
<LinearLayout
android:id="#+id/layout2"
android:layout_width="match_parent"
android:layout_height="40dp"
android:orientation="horizontal">
<com.whask.whask.utils.font.FontTextView
android:id="#+id/text_hot"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_gravity="center"
android:layout_marginLeft="10dp"
android:layout_marginStart="10dp"
android:background="#android:color/transparent"
android:text="5 HOT"
android:textSize="#dimen/abc_text_size_medium_material"
app:font="Neo-Sans-Std-Medium.otf"/>
</LinearLayout>
<ListView
android:id="#+id/result_whask_listview_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/layout2">
</ListView>
<LinearLayout
android:id="#+id/layout3"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_below="#+id/result_whask_listview_view"
android:orientation="horizontal">
<com.whask.whask.utils.font.FontTextView
android:id="#+id/text_not"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_gravity="center"
android:layout_marginLeft="10dp"
android:layout_marginStart="10dp"
android:background="#android:color/transparent"
android:text="2 NOT"
android:textSize="#dimen/abc_text_size_medium_material"
app:font="Neo-Sans-Std-Medium.otf"/>
</LinearLayout>
<ListView
android:id="#+id/result_whask_listview_view_no"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/layout3"
android:background="#color/my_whask_white_color">
</ListView>
</RelativeLayout>
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
DO NOT use ListView inside ScrollView. ListView itself has a scroll property and you don't have to use another ScrollView to make it scroll. Use a LinearLayout instead.
Listview have own scrolling property ,so dont use within scrollview...
thanks
I'm using TabWidget to get tabbed navigation. Each tab tile has icon and text below it. As content of my tab I currently have cardview list.
So, tab button layout:
<LinearLayout android:id="#+id/tabsLayout"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:id="#+id/tab_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_gravity="bottom|center"/>
<TextView android:id="#+id/title"
style="#android:style/TextAppearance.Holo.Medium"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:textColor="#000000"
android:text="test"
android:visibility="visible"
android:focusableInTouchMode="false"
android:layout_gravity="center"
android:textIsSelectable="true" android:textSize="13sp"
android:textAlignment="center"
android:gravity="center_horizontal"/>
</LinearLayout>
My activity where tab widget is used:
<?xml version="1.0" encoding="utf-8"?>
<TabHost
android:id="#android:id/tabhost"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="0"/>
<FrameLayout
android:id="#+id/realtabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"/>
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:orientation="horizontal" android:background="#84dadada"/>
</LinearLayout>
</TabHost>
FrameLayout is for replacing tab content with fragments when user switch between tabs. It works, but there are some problems though. This is how it looks like:
As you can see - first problem is icon alignment. If text is wrapped as multiline (large font and small screen), icon is not aligned with the rest ones that have one line label. How to get all icons properly aligned?
Second - there is white extra space just above my tab control - why? How to disable it?
Any ideas?
[edit]
My CardView is defined as follows:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:padding="3dp"
>
<android.support.v7.widget.CardView android:id="#+id/card_view"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_gravity="center_vertical"
android:background="?android:attr/selectableItemBackground"
card_view:cardCornerRadius="0dp"
card_view:cardElevation="dp" android:clickable="false">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_vertical"
android:orientation="horizontal">
<ImageView
android:id="#+id/card_image"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="2"
android:padding="6dp"
android:src="#drawable/ic_launcher"/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="5"
android:orientation="vertical"
android:padding="4dp">
<TextView
android:id="#+id/card_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="2dp"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textStyle="bold"/>
<TextView
android:id="#+id/card_info"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="2dp"
android:text="Small Text"
android:textAppearance="?android:attr/textAppearanceSmall"/>
</LinearLayout>
<ImageView
android:id="#+id/arrow"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:padding="6dp"
android:src="#drawable/arrow"/>
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
So it seems there is extra margin around cardview - top, bottom, left and right. How to disable it?
For the space issue have a look here, it may be a duplicate answer.
For the icon-alignment, have a look here, it shows how to keep your text on a single-line and use ellipsis to truncate it if your device doesn't have room to show it entirely. It may not be your perfect solution, but it's a good hint.
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/buttonLayout"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="1">
<Button
android:id="#+id/vehicleButton"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="1"
android:text="Refresh"
android:onClick="getVehicles" />
<Button
android:id="#+id/logoutButton"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="1"
android:text="Logout"
android:onClick="logout" />
</LinearLayout>
<ListView
android:id="#+id/android:list"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</ListView>
</LinearLayout>
Hi all, when the above ListView is populated with only a few items, I can still see the buttons, however, when the ListView is populated with more than the screen can display, the buttons seem to be 'pushed' above the UI and are no longer visible, only the scrollable ListView is now visible.
Are there any thoughts on how I can make the buttons appear again on longer lists?
Thanks
Try wrapping the ListView inside of a LinearLayout. You are adding a weight to the buttons to make sure they appear, but then when the ListView renders, it seems to be causing that. Let me know if that helps.
<LinearLayout
android:layout_height="0"
android:layout_width="fill_parent"
android:layout_weight="0"
android:orientation="vertical">
<ListView
android:id="#+id/android:list"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</ListView>
</LinearLayout>
For reference, I solved this by using a the following:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/buttonLayout"
android:layout_height="40dp"
android:layout_width="match_parent"
android:orientation="horizontal">
<Button
android:id="#+id/vehicleButton"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="1"
android:text="Refresh"
android:onClick="getVehicles" />
<Button
android:id="#+id/mapButton"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="1"
android:text="Map" />
<Button
android:id="#+id/logoutButton"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="1"
android:text="Logout"
android:onClick="logout" />
</LinearLayout>
<ListView
android:id="#+id/android:list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_below="#id/buttonLayout">
</ListView>
</RelativeLayout>
So I used a relative layout and also added the
android:layout_below="#id/buttonLayout to the listview to force it show below the buttonLayout
Please have a look at the following android xml file which is responsible for creating GUI
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/imageTitle"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="14dp"
android:text="#string/imageDate"
android:textAppearance="?android:attr/textAppearanceLarge" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="254dp"
android:layout_weight="0.34"
android:src="#drawable/test_image" />
<TextView
android:id="#+id/textView3"
android:layout_width="fill_parent"
android:layout_height="136dp"
android:text="#string/imageDescription" />
</LinearLayout>
</ScrollView>
I am trying to scroll the whole screen, but it is not happening. The uploaded images will make it clear to you. Why it is not scrolling? I am new to android and this is my second app. Please help!
for using scroll view, if u have entire view to be scrollable, use scroll view as parent layout and use code like this.
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true">
here android:fillViewport="true" this is important part which allows u to fill the entire screen for your layout. if any other issue ask .
As android.developer says for fillViewport Defines whether the scrollview should stretch its content to fill the viewport.
Change this 2 like this
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/textView3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/imageDescription" />
I think you should use wrap_content in the LinearLayout
I followed this tutorial, for now it's working nice, but i only have a problem, i need to center vertically the "Title" textview, when "Detail" textview text it's null or empty, something like this, any help appreciated, thanks
Here it's the custom_layout.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">
<ListView
android:id="#+id/list"
android:layout_width="1px"
android:layout_height="1px"
android:layout_weight="1">
</ListView>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:id="#+id/img"
android:layout_width="50dp"
android:layout_height="60dp"/>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="?android:attr/listPreferredItemHeight"
android:padding="6dip">
<TextView
android:id="#+id/detail"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/img"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:singleLine="true"
android:ellipsize="marquee" />
<TextView
android:id="#+id/title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/img"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_above="#id/detail"
android:layout_alignWithParentIfMissing="true"
android:gravity="center_vertical"
android:textColor="#ffffffff"
android:textSize="24sp" />
</RelativeLayout>
</LinearLayout>
</LinearLayout>
You use android:layout_gravity to center the actual text view and android:gravity to center the things inside the text view (like the text).
Example XML:
<TextView android:id="#+id/some_id"
android:text="Example text"
android:layout_height="70dp"
android:layout_width="wrap_content"
android:gravity="center_vertical" />