I have the following working xml layout for a ListView
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/text01"/>
<RelativeLayout
android:id="#+id/rel01"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/widget01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/logo"
/>
<ImageButton
android:id="#+id/widget02"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/widget01"
android:src="#drawable/refresh"
/>
</RelativeLayout>
<ListView
android:id="#+id/android:list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
<TextView
android:id="#+id/android:empty"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#ffffff"
/>
</LinearLayout>
I want to move text01 and all RelativeLayout in another file (it is the header for all my activities) and include it in this xml. I am trying but I am not able to do this, can sameone help me?
You should put the things you want to reuse into extra files. Then you can use the parts like:
<!-- my_header.xml -->
<?xml version="1.0" encoding="UTF-8"?>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/text01"/>
In another file include it with:
<include layout="#layout/my_header" />
<!-- your other stuff -->
First : create a new file layout xml : header.xml ; which will contain the TextView and all the RelativeLayout
Second : you can include it where ever you want with the following code :
<include android:id="#+id/myHeader"
layout="#layout/header" />
Related
How to include layout inside layout in Android?
I am creating common layout. I want to include that layout in another page.
Edit: As in a comment rightly requested here some more information. Use the include tag
<include
android:layout_width="match_parent"
android:layout_height="wrap_content"
layout="#layout/yourlayout" />
to include the layout you want to reuse.
Check this link out...
Note that if you include android:id... into the <include /> tag, it will override whatever id was defined inside the included layout. For example:
<include
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/some_id_if_needed"
layout="#layout/yourlayout" />
yourlayout.xml:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/some_other_id">
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/button1" />
</LinearLayout>
Then you would reference this included layout in code as follows:
View includedLayout = findViewById(R.id.some_id_if_needed);
Button insideTheIncludedLayout = (Button)includedLayout.findViewById(R.id.button1);
Use <include /> tag.
<include
android:id="#+id/some_id_if_needed"
layout="#layout/some_layout"/>
Also, read Creating Reusable UI Components and Merging Layouts articles.
Try this
<include
android:id="#+id/OnlineOffline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
layout="#layout/YourLayoutName" />
From Official documents about Re-using Layouts
Although Android offers a variety of widgets to provide small and
re-usable interactive elements, you might also need to re-use larger
components that require a special layout. To efficiently re-use
complete layouts, you can use the tag to embed another
layout inside the current layout.
Here is my header.xml file which i can reuse using include tag
<?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"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:gravity="center"
android:text="#string/app_name"
android:textColor="#000000" />
</RelativeLayout>
No I use the tag in XML to add another layout from another XML file.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#f0f0f0" >
<include
android:id="#+id/header_VIEW"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
layout="#layout/header" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#ffffff"
android:orientation="vertical"
android:padding="5dp" >
</LinearLayout>
Learn More Using this link
https://developer.android.com/training/improving-layouts/reusing-layouts.html
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".Game_logic">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:id="#+id/text1"
android:textStyle="bold"
tools:text="Player " />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textStyle="bold"
android:layout_marginLeft="20dp"
android:id="#+id/text2"
tools:text="Player 2" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Blockquote
Above layout you can used in other activity using
<?xml version="1.0" encoding="utf-8"?><androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".SinglePlayer">
<include layout="#layout/activity_game_logic"/>
</androidx.constraintlayout.widget.ConstraintLayout>
I have the same problem that this user : the other question
But I have the name of the class in my layout xml file correctly typed, and in the xml view it does not give any error, but when I change to graphical layout view I get an error saying :
java.lang.RuntimeException: You forgot the attributes swipeFrontView or swipeBackView.
You can add this attributes or use 'swipelist_frontview' and 'swipelist_backview'
identifiers
I added nineoldandroid and swipe-list jars.
Any tips on this?
Changing the ids in SwipeListView to
swipe:swipeBackView="#+id/swipelist_backview"
swipe:swipeFrontView="#+id/swipelist_frontview"
And in the list item view to
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<RelativeLayout
android:id="#+id/swipelist_backview"
...>
...
</RelativeLayout>
<RelativeLayout
android:id="#+id/swipelist_frontview"
...>
...
</RelativeLayout>
</FrameLayout>
Solved the problem for me. I think this bug is somehow related to this pull request https://github.com/47deg/android-swipelistview/pull/11
swipeListView have 2 views as "FrontView"&"BackView"
try this sample xml :
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<RelativeLayout
android:id="#+id/back"
style="#style/ListBackContent"
android:layout_width="wrap_content"
android:layout_height="110dp"
android:tag="back" >
<LinearLayout
android:id="#+id/backshowportion"
style="#style/ListBackContent"
android:layout_width="250dp"
android:layout_height="110dp"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:gravity="right|center" >
<TextView
.... />
<TextView
.... />
<TextView
..../>
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:id="#+id/front"
style="#style/ListFrontContent"
android:layout_width="match_parent"
android:layout_height="110dp"
android:orientation="vertical"
android:tag="front" >
<TextView
.... />
<TextView
.... />
<TextView
.... />
</RelativeLayout>
</FrameLayout>
You need in you list something like this :
<?xml version="1.0" encoding="utf-8"?>
<com.fortysevendeg.android.swipelistview.SwipeListView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:swipe="http://schemas.android.com/apk/res-auto"
android:id="#android:id/list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:listSelector="#00000000"
swipe:swipeActionLeft="dismiss"
swipe:swipeBackView="#+id/back"
swipe:swipeCloseAllItemsWhenMoveList="true"
swipe:swipeFrontView="#+id/front"
swipe:swipeMode="both" />
I am attempting to create some modular UI elements as described at Android Developers - Creating Reusable UI Components, unfortunately I'm not getting the desired result.
The article states:
you can override all the layout parameters. This means that any android:layout_* attribute can be used with the tag.
My XML code looks like this (relevant parts):
<?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">
<include android:id="#+id/radio_group"
layout="#layout/radio_buttons"
android:layout_marginTop="75dp"
/>
<include android:id="#+id/player_group"
layout="#layout/player_buttons"
android:layout_alignParentBottom="true"
/>
<EditText android:id="#+id/text_field"
android:singleLine="true"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="Enter Your Login ID:"
android:layout_below="#id/player_group"
/>
Here is the first of the included layouts:
<RadioGroup
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/radio_group"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_marginTop="20dp"
android:layout_marginLeft="20dp"
android:layout_marginBottom="20dp"
>
<RadioButton android:id="#+id/radio01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Song #1"
android:paddingLeft="45dp"
/>
[two more identical buttons]
<TextView android:id="#+id/choice"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="you have selected:"/>
</RadioGroup>
and the other:
<?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">
<Button android:text="btn01"
android:id="#+id/Button01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
/>
<Button android:text="#+id/Button02"
android:id="#+id/Button02"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
/>
<Button android:text="Start Playing"
android:id="#+id/startPlayerBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:onClick="doClick"
/>
</LinearLayout>
Unfortunately - this results in all the included UI elements bunched together on top of each other at the top of the screen. The EditText element aligns correctly, but none of the included elements will respond to any overrided attributes. I have tried a number of different ones with the same non-results.
Note: I also tried putting an android:layout_alignParentBottom="true" parameter into the included layouts thinking that it might need to be in there for it to be overridden, but got the same non-result.
also - the marginTop param doesn't do anything either.
So - any idea what I'm doing wrong?? This is driving me crazy!
Note: there was a question asked a little while ago about how to style included layouts, the answer was a reference to the page on Reusable UI Components. Just want to say that I have read that question and the answer and it hasn't helped.
There is a bug when using include where included layouts are not positioned correctly unless you specify values for android:layout_width and android:layout_height. Try this:
<?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">
<include android:id="#+id/radio_group"
layout="#layout/radio_buttons"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="75dp"
/>
<include android:id="#+id/player_group"
layout="#layout/player_buttons"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/radio_group"
/>
<EditText android:id="#+id/text_field"
android:singleLine="true"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="Enter Your Login ID:"
android:layout_below="#id/player_group"
/>
How to include layout inside layout in Android?
I am creating common layout. I want to include that layout in another page.
Edit: As in a comment rightly requested here some more information. Use the include tag
<include
android:layout_width="match_parent"
android:layout_height="wrap_content"
layout="#layout/yourlayout" />
to include the layout you want to reuse.
Check this link out...
Note that if you include android:id... into the <include /> tag, it will override whatever id was defined inside the included layout. For example:
<include
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/some_id_if_needed"
layout="#layout/yourlayout" />
yourlayout.xml:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/some_other_id">
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/button1" />
</LinearLayout>
Then you would reference this included layout in code as follows:
View includedLayout = findViewById(R.id.some_id_if_needed);
Button insideTheIncludedLayout = (Button)includedLayout.findViewById(R.id.button1);
Use <include /> tag.
<include
android:id="#+id/some_id_if_needed"
layout="#layout/some_layout"/>
Also, read Creating Reusable UI Components and Merging Layouts articles.
Try this
<include
android:id="#+id/OnlineOffline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
layout="#layout/YourLayoutName" />
From Official documents about Re-using Layouts
Although Android offers a variety of widgets to provide small and
re-usable interactive elements, you might also need to re-use larger
components that require a special layout. To efficiently re-use
complete layouts, you can use the tag to embed another
layout inside the current layout.
Here is my header.xml file which i can reuse using include tag
<?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"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:gravity="center"
android:text="#string/app_name"
android:textColor="#000000" />
</RelativeLayout>
No I use the tag in XML to add another layout from another XML file.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#f0f0f0" >
<include
android:id="#+id/header_VIEW"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
layout="#layout/header" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#ffffff"
android:orientation="vertical"
android:padding="5dp" >
</LinearLayout>
Learn More Using this link
https://developer.android.com/training/improving-layouts/reusing-layouts.html
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".Game_logic">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:id="#+id/text1"
android:textStyle="bold"
tools:text="Player " />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textStyle="bold"
android:layout_marginLeft="20dp"
android:id="#+id/text2"
tools:text="Player 2" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Blockquote
Above layout you can used in other activity using
<?xml version="1.0" encoding="utf-8"?><androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".SinglePlayer">
<include layout="#layout/activity_game_logic"/>
</androidx.constraintlayout.widget.ConstraintLayout>
In my Android app I declare a custom view in a separate XML file.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:id="#+id/download_interval_setter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical">
<Button
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:id="#+id/Button_interval_up"
style="?android:attr/buttonStyleSmall">
</Button>
<EditText
android:id="#+id/Download_interval"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"
android:numeric="integer">
</EditText>
<Button
android:id="#+id/Button_interval_down"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
</Button>
</LinearLayout>
Then I have my main.xml file where I would like to include the view declared in above XML like this:
<?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">
<ToggleButton android:layout_height="wrap_content"
android:id="#+id/XMLStart"
android:textOn="#string/auto_update_on"
android:textOff="#string/auto_update_off"
android:layout_width="wrap_content" />
<include layout="#layout/download_interval_setter"
android:layout_toRightOf="#id/XMLStart"/>
<Button android:layout_height="wrap_content"
android:id="#+id/ShowRadars"
android:text="#string/show_radars"
android:layout_width="wrap_content"
android:layout_below="#id/XMLStart"/>
<Button android:layout_height="wrap_content"
android:id="#+id/ShowAccidents"
android:text="#string/show_accidents"
android:layout_width="wrap_content"
android:layout_toRightOf="#id/ShowRadars"
android:layout_below="#id/XMLStart"/>
<Button android:layout_height="wrap_content"
android:id="#+id/ShowConstraints"
android:text="#string/show_constraints"
android:layout_width="wrap_content"
android:layout_below="#id/ShowRadars"/>
<Button android:layout_height="wrap_content"
android:id="#+id/ShowPatrols"
android:text="#string/show_patrols"
android:layout_width="wrap_content"
android:layout_below="#id/ShowRadars"
android:layout_toRightOf="#id/ShowConstraints"/>
</RelativeLayout>
As you can see I am trying to set the layout_toRightOf attribute of the included view but it is not set, as I can see also in hierarchyviewer
On the other hand if I simply copy-paste the content of the download_interval_setter.xml file to main.xml and declare the layout_toRightOf parameter there , the view will be positioned to right of as I want.
Where am I going wrong?
Thanks
You must use RelativeLayout as root layout in the included xml file, because android:layout_toRightOf cannot be used with LinearLayout.
You have not specified the width and the height of the include layout