I have a viewpager implemented on my app. In all my fragments I have circlepageindicator, header and footer. My main xml file is:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res/com.example.app"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<!-- Header aligned to top -->
<include layout="#layout/header" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<com.viewpagerindicator.CirclePageIndicator
android:id="#+id/indicator"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="33dp"
app:radius="4dp"
app:fillColor="#00CCFF"/>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:padding="10dip" />
</RelativeLayout>
<!-- Footer aligned to bottom -->
<include layout="#layout/footer" />
</RelativeLayout>
My header.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/header"
android:layout_width="40dp"
android:layout_height="30dp"
android:layout_alignParentTop="true"
android:layout_centerInParent = "true">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/app" />
</RelativeLayout>
My footer.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/footer"
android:layout_width="40dp"
android:layout_height="30dp"
android:layout_alignParentBottom="true"
android:layout_centerInParent="true" >
<ImageView
android:id="#+id/foot"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/app_rotate" />
The output of the code is:
As you can see, the header part is below the background of the fragment but the footer is not. I want to see my header like the footer is. As you can see I have provided all the xml attributes to header like footer but why the output is not same? I hope I get some help from you. Thanks in advance.
Z-order of elements is a "last one on top" model.
Move this line:
<include layout="#layout/header" />
To come after the main body:
</RelativeLayout>
<include layout="#layout/header" />
<!-- Footer aligned to bottom -->
<include layout="#layout/footer" />
Related
I have this XML
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/LinearLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#color/blanco"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/verde_us" >
<ImageView
android:id="#+id/detalle_imagen_categoria"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:src="#drawable/icon_map" />
<View
android:id="#+id/View02"
android:layout_width="2dp"
android:layout_height="fill_parent"
android:background="#color/blanco" />
<TextView
android:id="#+id/text_nombre_empresa"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="5dp"
android:text="#string/text_noticias"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#color/blanco" />
</LinearLayout>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</android.support.v4.view.ViewPager>
</LinearLayout>
But when I run the app the output is other.
Any help? Thanks!
I want the tabs below the text that says "Ahumadero" In the XML
Then stop using action bar tabs. Use some other sort of tabbed indicator for your ViewPager, one where you control the position by placing it in the LinearLayout yourself. There are many open source implementations, such as PagerSlidingTabStrip.
I have CirclePageIndicator with three fragments. What I want is to embed same header and footer in all the fragments. When the user swipes the fragments the header and footer should be seen and accessible all the time. I found a solution and tried this way but doing this way the circles get missing or disappear from the view. I spent a lots of time but could not solve. This is my xml layout how I tried to embed according to the link:
<?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:orientation="vertical" >
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above = "#+id/footer"
android:layout_below = "#+id/header" >
<com.viewpagerindicator.CirclePageIndicator
android:id="#+id/indicator"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</RelativeLayout>
<!-- Footer aligned to bottom -->
<RelativeLayout
android:id="#+id/footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#FC0"
android:gravity="center" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:text="Fixed Footer"
android:textColor="#000"
android:textSize="20sp" />
</RelativeLayout>
</android.support.v4.view.ViewPager>
What am I doing wrong?
just put the circular indicator above the viewpager.. or they would swipe out with the pager..
<relative layout>
<circular indicator />
<viewpager ><--- ---->
</relative layout>
I am trying to get a couple of buttons to attach to the bottom of the screen.
For some reason they are attaching themselves to the previous view:
As you can see the buttons are overwriting the previous view.
This is the layout I use:
<?xml version="1.0" encoding="utf-8" ?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:text_field_element="http://schemas.android.com/apk/res-auto"
xmlns:button_element="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true"
android:orientation="vertical"
>
<LinearLayout android:id="#+id/data_entry"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
>
<com.applicat.meuchedet.views.TextFieldElement
android:id="#+id/dental_clinics_search_screen_clinic_type_selector"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
text_field_element:prompt="#string/dental_clinic_search_screen_dental_clinic_type_prompt"
text_field_element:initial_text="#string/dental_clinic_type_initial"
text_field_element:cursor_visible="false"
/>
<include
layout="#layout/separator_element"
/>
<com.applicat.meuchedet.views.LocationSelector
android:id="#+id/dental_clinics_location_selector"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
<include
layout="#layout/separator_element"
/>
<com.applicat.meuchedet.views.TimeSelector
android:id="#+id/dental_clinics_time_selector"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
<include
layout="#layout/separator_element"
/>
</LinearLayout>
<com.applicat.meuchedet.views.ButtonElement
android:id="#+id/dental_clinics_search_screen_search_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true"
button_element:margin_bottom="10"
/>
<com.applicat.meuchedet.views.ClearButtonElement
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/dental_clinics_search_screen_search_button"
android:layout_alignParentBottom="true"
button_element:margin_bottom="10"
/>
</RelativeLayout>
separator_element.xml
<?xml version="1.0" encoding="UTF-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dip"
android:layout_marginBottom="15dip"
android:src="#drawable/form_separator"
>
</ImageView>
============================================================================
Edit:
So, it seems that the problem is caused by the fact that the view is put into a ScrollView. We need the ScrollView due to the possibility of small screens.
For some reason it sets the size wrong or something and puts the buttons just below the fields instead of at the very bottom.
I have this xml file as a layout of an appwidget:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#android:color/black" >
<!-- ListView to be shown on widget -->
<ListView
android:id="#+id/listViewWidget"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<Button
android:id="#+id/refresh_appwidget"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="refresh"
/>
</LinearLayout>
The button is not displayed, and I don't know the cause. I tested layout_with match_parent but always the same result.
How can I fix this issue?
Set a fixed height for the listview for example android:layout_height="400dp" in LinearLayout.
Or use a RelativeLayout
Or add your button as a footer to listview. So you can see the button when you scroll down
Or add your button as a header to listview.
With Relative layout you can place the button at the top or button and relative tot eh button you can place your listview.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:background="#android:color/black"
android:layout_height="fill_parent" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:text="Button" />
<ListView
android:id="#+id/listView1"
android:layout_above="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" >
</ListView>
</RelativeLayout>
Try with RelativeLayout:
<?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="wrap_content"
android:orientation="vertical"
android:background="#android:color/black" >
<!-- ListView to be shown on widget -->
<ListView
android:id="#+id/listViewWidget"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<Button
android:id="#+id/refresh_appwidget"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="refresh"
/>
</RelativeLayout>
I try and see the Button but dont see the List
I have a ScrollView in a LinearLayout along with a header LinearLayout on top. I have given the main LinearLayout a background. If I keep the background for the ScrollView everything displays fine. But If I add a lot of content then the ScrollView background stretches. So I want to keep the ScrollView transparent.
But if I remove the background attribute or if I try android:background="#android:color/transparent" the content inside the ScrollView vanishes. All I can see is the header and the background from the outer LinearLayouts.
This is how I want my Views:
<Linear Layout with background image>
<Header Linear Layout>
</Header Linear Layout>
<ScrollView with no background>
<Layouts in Scroll View>
</ScrollView>
Here is the code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/bg"
android:orientation="vertical" >
<include layout="#layout/topbar" />
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
style="#style/Labels"
android:text="#string/posts_add_postcontent" />
<EditText
android:id="#+id/postsAddContent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="#string/posts_add_postcontent_h"
android:inputType="textMultiLine"
android:maxLength="3000"
android:minLines="3" />
</LinearLayout>
</ScrollView>
</LinearLayout>
Note: The header LinearLayout is included via another file:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/topbar"
android:layout_width="fill_parent"
android:layout_height="30dip"
android:background="#layout/bgtop_repeat"
android:orientation="horizontal"
android:paddingTop="2dip" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/app_name"
android:src="#drawable/cornerlogo" />
<Button
android:id="#+id/menubuton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:background="#drawable/menubutton" />
</RelativeLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#layout/headshadow_repeat"
android:orientation="horizontal" />
</LinearLayout>
Thanks in advance :)
Try
android:layout_height="wrap_content"
in included layout