Is it possible to reuse the outer elements of an Android layout? - android

I have two very similar Android layouts:
default_spinner.xml
<?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:minHeight="#dimen/settings_line_min_height"
android:orientation="horizontal"
android:paddingLeft="#dimen/common_padding"
android:paddingRight="#dimen/common_padding">
<TextView
android:id="#id/label"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1" />
<ImageButton
android:id="#+id/down_spinner_btn"
style="#style/SpinnerDownButton"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
<EditText
android:id="#+id/edit_box"
style="#style/EditableSpinnerText"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:inputType="number"
android:imeOptions="actionDone"
android:longClickable="false" />
<ImageButton
android:id="#+id/up_spinner_btn"
style="#style/SpinnerUpButton"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
</LinearLayout>
and
custom_spinner.xml
<?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="horizontal"
android:paddingLeft="#dimen/common_padding"
android:paddingRight="#dimen/common_padding">
<TextView
android:id="#id/label"
style="#style/Subhead.Translucent"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1" />
<ImageButton
android:id="#+id/down_spinner_btn"
style="#style/SpinnerDownButton"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
<com.company.CustomEditText
android:id="#+id/edit_box"
style="#style/EditableSpinnerText"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:inputType="text" />
<ImageButton
android:id="#+id/up_spinner_btn"
style="#style/SpinnerUpButton"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
</LinearLayout>
As you can see, the only difference between the two is that the second one has a custom implementation of the EditText class.
In some classes, I load the default spinner:
View view = inflater.inflate(R.layout.default_spinner, parent, false);
And in other classes, I load the custom spinner:
View view = inflater.inflate(R.layout.custom_spinner, parent, false);
This all works fine, but the inefficiency bothers me.
I know it's possible to reuse layout elements in Android using the <import /> command... however, I'm not sure if that would be applicable here. Since a majority of both of these layouts is the same, I'd like to consolidate the identical code and just have it use either the CustomEditText or EditText class, depending on the situation.
Does anyone have an idea of how I could reuse the outer elements of these layouts and eliminate all of that duplication?

Yes, there is. In this case, you can have a single layout file with a ViewStub in place of EditText/CustomEditText. Like this:
<?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="horizontal"
android:paddingLeft="#dimen/common_padding"
android:paddingRight="#dimen/common_padding">
<TextView
android:id="#id/label"
style="#style/Subhead.Translucent"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1" />
<ImageButton
android:id="#+id/down_spinner_btn"
style="#style/SpinnerDownButton"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
<ViewStub
android:id="#+id/view_stub"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
<ImageButton
android:id="#+id/up_spinner_btn"
style="#style/SpinnerUpButton"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
</LinearLayout>
Then, in your Java code, you will lazily inject the EditText of your choice:
ViewStub viewStub = (ViewStub) findViewById(R.id.view_stub);
viewStub.setLayoutResource(someCondition ? R.layout.custom_edit_text : R.layout.regular_edit_text);
viewStub.inflate();
As you can see, you'll have two more layout files for each EditText:
custom_edit_text.xml
<com.company.CustomEditText
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/edit_box"
style="#style/EditableSpinnerText"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:inputType="text" />
regular_edit_text.xml
<EditText
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/edit_box"
style="#style/EditableSpinnerText"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:inputType="text" />

I think, the best way is to use single layout adding different views programmatically. That's how it would be easier to support in future.

Related

android use AutoCompleteTextView in recyclerview

I am using AutoCompleteTextView in each recyclerview row, then i got the problem when dropdown show, it overlay autocompletetextview, so can see what I text in this.
Here is my xml for recyclerview adapter
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:drawme="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:orientation="vertical">
<com.rafakob.drawme.DrawMeTextView
android:id="#+id/name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:focusable="true"
android:focusableInTouchMode="true"
android:gravity="center"
android:padding="10dp"
android:textColor="#000000"
android:textSize="18sp"
android:textStyle="bold"
drawme:dm_backColor="#color/background_light"
drawme:dm_radiusTopLeft="10dp"
drawme:dm_radiusTopRight="10dp">
<requestFocus />
</com.rafakob.drawme.DrawMeTextView>
<com.rafakob.drawme.DrawMeLinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
drawme:dm_backColor="#color/grayColor70"
drawme:dm_radiusBottomLeft="10dp"
drawme:dm_radiusBottomRight="10dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="10dp">
<AutoCompleteTextView
android:id="#+id/machine"
style="#style/Widget.AppCompat.Spinner.DropDown"
android:layout_width="match_parent"
android:layout_height="46dp"
android:layout_weight="1"
android:gravity="center" />
<CheckBox
android:id="#+id/checkbox"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp" />
</LinearLayout>
</LinearLayout>
</com.rafakob.drawme.DrawMeLinearLayout>
</LinearLayout>
In code i'm using normal implement with using arrayAdapter, then setadapter for that autocompletetextview
In manifest i set adjustPan|adjustResize but still not working. Does anyone have solution for this?
UPDATE
I just tested with only autocompletetextview as a child of RecyclerView row. The result image below:
After reading AutoCompleteTextView document from Android, i found the solution is just use android:dropDownVerticalOffset
it's solve my problem ^.,.^

Three buttons evenly divided linear layout

So, I am trying to use a linear layout to hold three different buttons, each should take up 33% of the width on one line. This linear layout will be below all the other content in my relative layout, which holds all the other widgets on this activity. Unfortunately, when I add the third button into the layout, the other two have a white bar along the bottom of them and the third button (in this case the home button) is positioned higher than the others.
Can someone explain this behavior and how to rectify it? Thanks.
This is the XML file for the linear layout, I've removed all the text for the other widgets. If that would be helpful, I can post it as well.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true">
<Button
android:layout_width="0dp"
android:layout_weight=".33"
android:layout_height="wrap_content"
android:text="#string/adfazsdfasdfadfsagjlfkdlgjklfsadgfjgps"
android:onClick="resetDates"
android:background="#drawable/sumbitstyleing"
android:id="#+id/resetDatesButton" />
<Button
android:layout_width="0dp"
android:layout_weight=".33"
android:layout_height="wrap_content"
android:text="#string/home"
android:onClick="home"
android:id="#+id/homeButtonSearch"
android:background="#drawable/generalbutton" />
<Button
android:layout_weight=".33"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="#string/submitchanges"
android:onClick="submitChanges"
android:background="#drawable/sumbitstyleing"
android:id="#+id/submitchanges" />
</LinearLayout>
The first picture is WITHOUT the third button, the second picture is WITH the third button.
Try this, I have removed Properties you should use with RelativeLayout and unnecessary with LinearLayout, and buttons aligned horizontally,
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
and assigned Weightsum to LinearLayout along with button height to match parents
<?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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:weightSum="1">
<Button
android:id="#+id/resetDatesButton"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".33"
android:onClick="resetDates"
android:text="Rese check dates" />
<Button
android:id="#+id/homeButtonSearch"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".33"
android:onClick="home"
android:text="home" />
<Button
android:id="#+id/submitchanges"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".33"
android:onClick="submitChanges"
android:text="submit changes" />
</LinearLayout>
</RelativeLayout>
Result
Here you can go this way :
<?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:background="#color/white"
>
<LinearLayout
android:layout_width="300dp"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_centerHorizontal="true"/>
<!--Buttons -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="3"
>
<android.support.v7.widget.AppCompatButton
android:id="#+id/motor_team_send_sms_btn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/send_sms"
/>
<android.support.v7.widget.AppCompatButton
android:id="#+id/motor_team_sleep_btn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/sleep"
/>
<android.support.v7.widget.AppCompatButton
android:id="#+id/motor_team_rise_btn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/rise"
/>
</LinearLayout>
Output is:
This might help you.
Try this, in your LinearLayout add android:gravity="center"
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center">
...
</LinearLayout>

Add multiple children layouts from XML file to another layout

My layout is based on what Android Studio creates - blank with an action bar. This is the default code to inflate my fragment_list.xml into activity_stats.xml (I only have one Java file)
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_list, container, false);
return rootView;
}
Activity_stats is unaltered, just like Android Studio generated it. This is fragment_list.xml
<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="com.company.dummyname.stats$PlaceholderFragment" >
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:clipToPadding="false"
android:paddingTop="#dimen/network_margin_vertical"
android:paddingLeft="#dimen/network_margin_horizontal"
android:paddingRight="#dimen/network_margin_vertical" >
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/networkContainer"/>
</ScrollView>
</RelativeLayout>
I want to add multiple children to networkContainer. The children should be layouts from network.xml, which looks like this:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.GridLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:grid="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
tools:context="com.company.dummyname.stats$PlaceholderFragment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
grid:columnCount="2" >
<ImageView
android:layout_width="88dp"
android:layout_height="70dp"
android:background="#fff8cdac"
grid:layout_row="0"
grid:layout_column="0"
grid:layout_rowSpan="2"
android:src="#drawable/ic_launcher"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="8dp"
grid:layout_row="0"
grid:layout_column="1"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="9999.99"
android:id="#+id/totalToday"
android:textSize="32sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" today"
android:textSize="32sp" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="46dp"
android:paddingLeft="8dp"
grid:layout_row="1"
grid:layout_column="1"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="9999.99"
android:id="#+id/totalYesterday"
android:textSize="24sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" yesterday"
android:textSize="24sp" />
</LinearLayout>
<TableLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
grid:layout_row="2"
grid:layout_columnSpan="2">
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView
style="#style/StatsCell" />
<TextView
style="#style/StatsCell"
android:text="Hits" />
</TableRow>
<TableRow
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
style="#style/StatsCell"
android:text="Today"
android:layout_height="match_parent" />
<TextView
style="#style/StatsCell"
android:id="#+id/todayHits"
android:text="9999" />
</TableRow>
</TableLayout>
</android.support.v7.widget.GridLayout>
There will be more data and one more row, but I removed them to simplify the question. The goal is to have many instances of network.xml with different data. How do I insert them and alter the data inside? I did research on Google, but without success. Please ignore the hardcoded strings and dimensions, I'll fix that.
EDIT: I need to add the children programmatically, not in XML, because the number of network.xml instances will vary depending on user settings.
IN XML
To Include multiple layouts you should use include element in the parent layout to referring to child layouts
IN CODE (PROGRAMATICALLY)
In the onCreateView function where you get the root View try to get the container layout like this
LinearLayout layout = (LinearLayout) rootView.findViewById(R.id.networkContainer);
and then in that linear layout create and add the instances of the other views you want to add like this
to get the View for the child Layout use LayoutInflator
layout.addView(newView);
and finally return the parent View

List view with image

My problem is to find best view configuration for my application that have a record in the listView.
My main.xml has this content:
<LinearLayout android:id="#+id/tabName" android:orientation="vertical"
android:layout_width="match_parent" android:layout_height="match_parent">
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/textConnection" android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:minHeight="20dp"
/>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/textTitle" android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:minHeight="40dp"
/>
<ListView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/listRecord"
android:layout_width="match_parent" android:layout_height="match_parent">
</ListView>
</LinearLayout>
And the my actual row of ListView is:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/imageBox"
android:layout_width="48px"
android:layout_marginTop="13dp"
android:layout_height="48px">
</ImageView>
<TextView
android:id="#+id/longText" android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
/>
<TextView
android:id="#+id/num1" android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
/>
<TextView
android:id="#+id/num2" android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
/>
<TextView
android:id="#+id/num3" android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
/>
</LinearLayout>
I tried with TableLayout but starting the application report an error in the bindView.
Can I write my XML code with only textView?
Consider that then I must add the caption of the ListView that have three image above each column with number.
Thank's.
I think the ListView is indeed your best option.
Can I write my XML code with only textView?
Yes, of course.
I don't see what is your problem actually. You should have an activity layout with the textConnection, the textTitle, then the 3 images aligned to the right (missing in your layout file), and the listview.
As for the row xml layout, I think it is OK! Just combine it with a simple cursor adapter in your java code, and you're done.

MergeAdapter layout issue in a fragment

I'm trying to make a layout in Android with Fragments. I started to use Commonsware's MergeAdapter but I'm having a weird bit of trouble. The layout worked fine before, but now I get this:
http://img856.imageshack.us/img856/2796/layoutbug.png
There are a couple problems: The white strip should have text going all the way across its length. I set the TextView with a white background to make sure the width was being set correctly. The checkbox right below it should also say "Issue?" but it's trying to wrap the text for some reason.
Here is the layout code that is being added:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical">
<TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Instructions" />
<TextView android:id="#+id/tvInstructions" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Instructions go here" android:textSize="32dp" android:background="#FFFFFF"></TextView>
<LinearLayout android:layout_height="wrap_content" android:layout_width="match_parent" android:orientation="horizontal" android:paddingTop="24dp">
<CheckBox android:id="#+id/cbIssues" android:layout_height="wrap_content" android:layout_weight="1" android:layout_width="0dp" android:text="Issues?" />
<TextView android:id="#+id/tvStation" android:layout_height="wrap_content" android:layout_width="0dp" android:layout_weight=".5" android:text="Station:" />
<Spinner android:id="#+id/spStation" android:layout_height="wrap_content" android:layout_width="0dp" android:layout_weight=".5"/>
</LinearLayout>
<TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Pending data" />
</LinearLayout>
and here's how I'm inflating it inside the Fragment's onActivityCreated:
LayoutInflater inflater = (LayoutInflater)getActivity().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
MergeAdapter _adapter = new MergeAdapter();
View observationHeaderView = inflater.inflate(R.layout.observationheader, getListView(), false);
_adapter.addView(observationHeaderView);
I get a feeling it has something to do with how I'm inflating the layout. Any help would be appreciated. Thanks.
Don't use match_parent for android:layout_height for something going into an AdapterView, such as your root LinearLayout.
You might also consider temporarily putting your header layout outside the ListView (e.g., in a vertical LinearLayout also holding the ListView) and get it debugged before adding the complication of having it in the ListView.
Beyond that, fire up Hierarchy View (Eclipse perspective or standalone edition) and try to figure out where your layout rules are going wrong.
Also, I am uncertain how well your Spinners will work inside of a ListView on Honeycomb.
It appears my problem was with layout_width being match_parent in certain places in my header, when it should have been wrap_content. The following worked:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical">
<TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Instructions" />
<TextView android:id="#+id/tvInstructions" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Instructions go here" android:textSize="32dp" android:background="#FFFFFF"></TextView>
<LinearLayout android:layout_height="wrap_content" android:layout_width="match_parent" android:orientation="horizontal" android:paddingTop="24dp">
<CheckBox android:id="#+id/cbIssues" android:layout_height="wrap_content" android:layout_weight="1" android:layout_width="wrap_content" android:text="Issues?" />
<TextView android:id="#+id/tvStation" android:layout_height="wrap_content" android:layout_width="wrap_content" android:layout_weight=".5" android:text="Station:" />
<Spinner android:id="#+id/spStation" android:layout_height="wrap_content" android:layout_width="wrap_content" android:layout_weight=".5"/>
</LinearLayout>
<TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Pending data" />
</LinearLayout>

Categories

Resources