ScrollView Still comes Behind out of it's Area - android

This Is My 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.xxx.xxx.MyActivity" >
<LinearLayout
android:id="#+id/viewFromDateToDate"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_gravity="center"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
android:gravity="center"
android:orientation="horizontal" >
<EditText
android:id="#+id/txtFromDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableRight="#drawable/timesheet_icon"
android:editable="false"
android:focusableInTouchMode="false"
android:hint="#string/txtFromDate"
android:inputType="date"
android:onClick="selectDate"
android:textSize="#dimen/generalTextSize" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:text="#string/lblFromTo"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="#dimen/generalTextSize" />
<EditText
android:id="#+id/txtToDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableRight="#drawable/timesheet_icon"
android:editable="false"
android:focusableInTouchMode="false"
android:hint="#string/txtToDate"
android:inputType="date"
android:onClick="selectDate"
android:textSize="#dimen/generalTextSize" />
<Button
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:background="#drawable/green_button_department"
android:text="#string/btnShowData"
android:textColor="#color/white" />
</LinearLayout>
<View
android:id="#+id/upperSeparator"
android:layout_width="fill_parent"
android:layout_height="1dp"
android:layout_below="#id/viewFromDateToDate"
android:layout_marginTop="15dp"
android:background="#android:color/darker_gray" />
<LinearLayout
android:id="#+id/viewTimeOffDetailsHeader"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/upperSeparator"
android:orientation="horizontal"
android:padding="10dp" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="3"
android:text="#string/txtHeaderTimeOff"
android:textSize="#dimen/generalTextSize" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="2"
android:text="#string/txtHeaderDate"
android:textSize="#dimen/generalTextSize" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/txtHeaderHours"
android:textSize="#dimen/generalTextSize" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/txtHeaderAction"
android:textSize="#dimen/generalTextSize" />
</LinearLayout>
<View
android:id="#+id/lowerSeparator"
android:layout_width="fill_parent"
android:layout_height="1dp"
android:layout_below="#id/viewTimeOffDetailsHeader"
android:background="#android:color/darker_gray" />
<ScrollView
android:id="#+id/scrollDiv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/lowerSeparator" >
<LinearLayout
android:id="#+id/viewTimeOffDetailsArea"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
</LinearLayout>
</ScrollView>
<LinearLayout
android:id="#+id/viewTimeOffDetailsFooter"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_gravity="center"
android:gravity="center"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
</LinearLayout>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:layout_marginLeft="15dp"
android:background="#drawable/green_button_department"
android:text="#string/btnSubmitTimeOff"
android:textColor="#color/white"
android:textSize="20sp" />
</LinearLayout>
</RelativeLayout>
I want my LinerLayout scrollDiv to Be in Between of lowerSeparator and viewTimeOffDetailsFooter But the problem is ScrolView is still displaying it's Elements After viewTimeOffDetailsFooter Starts.
.
Here is an output.
Of XML Layout
Here you can see the Buttons of scrollDiv Still Displays after viewTimeOffDetailsFooter Buttons. I know that i should not put whole File But i am not getting proper solution that's why. Thanks.

you just need to place it above the viewTimeOffDetailsFooter, by adding below attribute to your scrollDiv
android:layout_above="#+id/viewTimeOffDetailsFooter"

Your viewTimeOffDetailsFooter doesn't have any positional link with scrollDiv, so add to it new rule android:layout_below="#id/scrollDiv". It can work only without android:layout_alignParentBottom="true" rule - need to try.

Related

Android text cut off in bottom of screen

Ok, after trying any solution I found I decided to put my code in here for help.
I get HTML from JSON and I place it in a TextView to show it.
This is it:
hoursTextView.setText(Html.fromHtml(hours));
hoursTextView.setVisibility(View.VISIBLE);
My problem is, that whenever the content above this TextView takes alot of height, I see only cutted top letters of this TextView and I can't scroll down!
This is my Layout XML:
<?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"
>
<ProgressBar
android:id="#+id/loadData"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="50dp"
android:layout_centerInParent="true"
/>
<ImageView
android:id="#+id/coverImg"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#000000"
android:scaleType="fitCenter"
android:adjustViewBounds="true"
android:layout_marginBottom="5dp"
/>
<TextView
android:id="#+id/fbAbout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/coverImg"
android:gravity="center"
/>
<View
android:id="#+id/seperator"
android:layout_width="fill_parent"
android:layout_height="1dp"
android:background="#eeeeee"
android:layout_below="#+id/fbAbout"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
/>
<LinearLayout
android:id="#+id/buttons"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/seperator"
android:layout_marginStart="5dp"
android:layout_marginEnd="5dp"
>
<TextView
android:id="#+id/type"
android:layout_width="0dp"
android:layout_height="70dp"
android:background="#drawable/circle_text"
android:textAlignment="center"
android:gravity="center"
android:padding="10dp"
android:drawableTop="#drawable/beer"
android:drawablePadding="5dp"
android:text="TYPE"
android:layout_weight="1"
/>
<TextView
android:id="#+id/age"
android:layout_width="0dp"
android:layout_height="70dp"
android:background="#drawable/circle_text"
android:textAlignment="center"
android:gravity="center"
android:padding="10dp"
android:drawableTop="#drawable/age_big"
android:drawablePadding="5dp"
android:layout_marginStart="10dp"
android:text="AGE"
android:layout_weight="1"
/>
<Button
android:id="#+id/callToPlace"
android:layout_width="0dp"
android:layout_height="70dp"
android:background="#drawable/circle_text"
android:textAlignment="center"
android:gravity="center"
android:padding="10dp"
android:drawableTop="#drawable/ic_call_black_24dp"
android:drawablePadding="5dp"
android:layout_marginStart="10dp"
android:text="CALL"
android:layout_weight="1"
/>
<Button
android:id="#+id/nav"
android:layout_width="0dp"
android:layout_height="70dp"
android:background="#drawable/circle_text"
android:textAlignment="center"
android:gravity="center"
android:padding="10dp"
android:drawableTop="#drawable/navigate"
android:drawablePadding="5dp"
android:layout_marginStart="10dp"
android:text="navigate"
android:layout_weight="1"
/>
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="HOURS"
android:id="#+id/hoursTitle"
android:layout_below="#+id/buttons"
android:layout_centerHorizontal="true"
android:visibility="gone"
android:layout_marginTop="10dp"
/>
<!--This is the TextView which is cut -->
<TextView
android:id="#+id/hours"
android:layout_marginTop="5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/hoursTitle"
android:visibility="gone"
android:layout_centerHorizontal="true"
android:gravity="center"
/>
</RelativeLayout>
The last TextView, with the ID of hours, is being cut on the bottom of the screen.
Hope someone can help me with this,
thanks!
You can use ScrollView for full screen.
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/output">
<ProgressBar
android:id="#+id/loadData"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="50dp"
android:layout_centerInParent="true"
/>
<ImageView
android:id="#+id/coverImg"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#000000"
android:scaleType="fitCenter"
android:adjustViewBounds="true"
android:layout_marginBottom="5dp"
/>
<TextView
android:id="#+id/fbAbout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/coverImg"
android:gravity="center"
/>
<View
android:id="#+id/seperator"
android:layout_width="fill_parent"
android:layout_height="1dp"
android:background="#eeeeee"
android:layout_below="#+id/fbAbout"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
/>
<LinearLayout
android:id="#+id/buttons"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/seperator"
android:layout_marginStart="5dp"
android:layout_marginEnd="5dp"
>
<TextView
android:id="#+id/type"
android:layout_width="0dp"
android:layout_height="70dp"
android:background="#drawable/circle_text"
android:textAlignment="center"
android:gravity="center"
android:padding="10dp"
android:drawableTop="#drawable/beer"
android:drawablePadding="5dp"
android:text="TYPE"
android:layout_weight="1"
/>
<TextView
android:id="#+id/age"
android:layout_width="0dp"
android:layout_height="70dp"
android:background="#drawable/circle_text"
android:textAlignment="center"
android:gravity="center"
android:padding="10dp"
android:drawableTop="#drawable/age_big"
android:drawablePadding="5dp"
android:layout_marginStart="10dp"
android:text="AGE"
android:layout_weight="1"
/>
<Button
android:id="#+id/callToPlace"
android:layout_width="0dp"
android:layout_height="70dp"
android:background="#drawable/circle_text"
android:textAlignment="center"
android:gravity="center"
android:padding="10dp"
android:drawableTop="#drawable/ic_call_black_24dp"
android:drawablePadding="5dp"
android:layout_marginStart="10dp"
android:text="CALL"
android:layout_weight="1"
/>
<Button
android:id="#+id/nav"
android:layout_width="0dp"
android:layout_height="70dp"
android:background="#drawable/circle_text"
android:textAlignment="center"
android:gravity="center"
android:padding="10dp"
android:drawableTop="#drawable/navigate"
android:drawablePadding="5dp"
android:layout_marginStart="10dp"
android:text="navigate"
android:layout_weight="1"
/>
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="HOURS"
android:id="#+id/hoursTitle"
android:layout_below="#+id/buttons"
android:layout_centerHorizontal="true"
android:visibility="gone"
android:layout_marginTop="10dp"
/>
<!--This is the TextView which is cut -->
<TextView
android:id="#+id/hours"
android:layout_marginTop="5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/hoursTitle"
android:visibility="gone"
android:layout_centerHorizontal="true"
android:gravity="center"
/>
</ScrollView>
Another Example:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Button 1" />
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Button 2" />
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Button 3" />
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Button 4" />
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Button 5" />
<ProgressBar
android:id="#+id/progressBar1"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<RadioButton
android:id="#+id/radioButton2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="RadioButton 1" />
<RadioButton
android:id="#+id/radioButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="RadioButton 2" />
<ToggleButton
android:id="#+id/toggleButton1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="ToggleButton" />
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Button 6" />
<SeekBar
android:id="#+id/seekBar1"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<Button
android:id="#+id/button3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button 7" />
<Button
android:id="#+id/button4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button 8" />
<CheckBox
android:id="#+id/checkBox1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="CheckBox" />
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button 9" />
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button 10" />
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Button 11" />
</LinearLayout>
</ScrollView>
Add the scroll view
<ScrollView
android:layout_width="match_parent"
android:layout_height="150dp" >
<!--Just assume it whatever your height is-->
<TextView
android:id="#+id/hours"
android:layout_marginTop="5dp"
android:layout_width="wrap_content"
android:layout_height="150dp"
android:layout_below="#+id/hoursTitle"
android:visibility="gone"
android:layout_centerHorizontal="true"
android:gravity="center"
/>
</ScrollView>

Nested linear layout buttons texts cropped off at the end

Android Studio 0.4.5
Hello,
I have created a dialog box from an Activity. Which displays like this:
The cancel has a missing 'l' and the delete has a missing 'e'.
I have tried to adjust the text size, but that didn't work. I have been playing around with it. But can't seem to find a solution.
Here my xml layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/ivRabbitLogo"
android:layout_width="match_parent"
android:layout_height="64dp"
android:scaleType="center"
android:background="#ff20a3ff"
android:contentDescription="Logo of Application" />
<EditText
android:id="#+id/etUpdateDlgName"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:inputType="text"
android:hint="Name"
android:textSize="22sp" />
<EditText
android:id="#+id/etUpdateDlgPhone"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:inputType="phone"
android:hint="Phone"
android:textSize="22sp" />
<EditText
android:id="#+id/etUpdateDlgEmail"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:inputType="textEmailAddress"
android:hint="Email"
android:textSize="22sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="horizontal"
android:layout_weight="1">
<Button
android:id="#+id/btnCancel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Cancel"
android:textSize="20sp"
android:layout_weight="1" />
<Button
android:id="#+id/btnSave"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Save"
android:textSize="20sp"
android:layout_weight="1" />
<Button
android:id="#+id/btnDelete"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Delete"
android:textSize="20sp"
android:layout_weight="1" />
</LinearLayout>
</LinearLayout>
Many thanks for any suggestions,
Have a look at this
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<ImageView
android:id="#+id/ivRabbitLogo"
android:layout_width="match_parent"
android:layout_height="64dp"
android:background="#ff20a3ff"
android:contentDescription="Logo of Application"
android:scaleType="center" />
<EditText
android:id="#+id/etUpdateDlgName"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:hint="Name"
android:inputType="text"
android:textSize="22sp" />
<EditText
android:id="#+id/etUpdateDlgPhone"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:hint="Phone"
android:inputType="phone"
android:textSize="22sp" />
<EditText
android:id="#+id/etUpdateDlgEmail"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:hint="Email"
android:inputType="textEmailAddress"
android:textSize="22sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="#+id/btnCancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Cancel"
android:textSize="20sp" />
<Button
android:id="#+id/btnSave"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Save"
android:textSize="20sp" />
<Button
android:id="#+id/btnDelete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Delete"
android:textSize="20sp" />
</LinearLayout>
you should not use android:layout_weight="1" in BUtton(childs), use android:weight="1" instead.
Use this...
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<ImageView
android:id="#+id/ivRabbitLogo"
android:layout_width="match_parent"
android:layout_height="64dp"
android:background="#ff20a3ff"
android:contentDescription="Logo of Application"
android:scaleType="center" />
<EditText
android:id="#+id/etUpdateDlgName"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:hint="Name"
android:inputType="text"
android:textSize="22sp" />
<EditText
android:id="#+id/etUpdateDlgPhone"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:hint="Phone"
android:inputType="phone"
android:textSize="22sp" />
<EditText
android:id="#+id/etUpdateDlgEmail"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:hint="Email"
android:inputType="textEmailAddress"
android:textSize="22sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal" >
<Button
android:id="#+id/btnCancel"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Cancel"
android:textSize="20sp" />
<Button
android:id="#+id/btnSave"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Save"
android:textSize="20sp" />
<Button
android:id="#+id/btnDelete"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Delete"
android:textSize="20sp" />
</LinearLayout>
</LinearLayout>
Declare you button with following change,
Just add a weight tag with Button like below,
<Button
android:id="#+id/btnCancel"
android:layout_width="0dp" // Change here
android:layout_height="wrap_content"
android:text="Cancel"
android:textSize="20sp"
android:layout_weight="1" />
<Button
android:id="#+id/btnSave"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="Save"
android:textSize="20sp"
android:layout_weight="1" />
<Button
android:id="#+id/btnDelete"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="Delete"
android:textSize="20sp"
android:layout_weight="1" />
try this in your code...hopefully this will work..
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="0dp"
android:orientation="horizontal"
android:layout_weight="1">
<Button
android:id="#+id/btnCancel"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="Cancel"
android:textSize="20sp"
android:layout_weight="1" />
<Button
android:id="#+id/btnSave"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="Save"
android:textSize="20sp"
android:layout_weight="1" />
<Button
android:id="#+id/btnDelete"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="Delete"
android:textSize="20sp"
android:layout_weight="1" />
</LinearLayout>

Android Linear Layout Suggestion

How do I get buttons to lay on the screen most optimally distributed and centered on the screen as follows:
The nearest I am able to get is this:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:orientation="horizontal"
>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:text="Button1" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button2" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button3" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button4" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="Button5"
android:layout_weight="1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button6"
android:layout_weight="1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button7"
android:layout_weight="1"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Button8"
android:layout_weight="1"/>
</LinearLayout>
Use a relativeLayout for the 3 linearLayouts.
To place the 3 linears below eachother use:
android:layout_below="#+id/linearLayout1"
and
android:layout_below="#+id/linearLayout2"
To center the linears use:
android:layout_centerInParent="true"
android:layout_gravity="center_vertical"
That will give you something like this:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_below="#+id/linearLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_gravity="center_vertical" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button5" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button6" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button7" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout3"
android:layout_below="#+id/linearLayout2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_gravity="center_vertical" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button8" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button1" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button2" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button3" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button4" />
</LinearLayout>
Unfortunately it is not showing the last line which is </RelativeLayout>

adapt bottom menu to all screens

I have designed one bottom menu in mu android app
it works fine in the screen which I work on
but if I change the screen , it doesn't fill all the width of screen even if I set width of the relativeLayout to fill_parent
here is the code of the menu :
<RelativeLayout
android:id="#+id/bar_bas"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:orientation="horizontal" >
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#null"
android:clickable="true" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/right_left"
android:text="test"
android:textColor="#bfd2b0" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/relativeLayout2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_toRightOf="#+id/relativeLayout1"
android:clickable="true" >
<Button
android:id="#+id/btn_circle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/left_circle"
android:text="test"
android:textColor="#bfd2b0" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/relativeLayout3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginLeft="-40dp"
android:layout_toRightOf="#+id/relativeLayout2"
android:clickable="true" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/circle"
android:text="test"
android:textColor="#bfd2b0" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/relativeLayout4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="-38dp"
android:layout_alignParentBottom="true"
android:layout_toRightOf="#+id/relativeLayout3"
android:clickable="true" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/right_circle"
android:text="test"
android:textColor="#bfd2b0" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/relativeLayout5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_toRightOf="#+id/relativeLayout4"
android:clickable="true" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/right_left"
android:text="test"
android:textColor="#bfd2b0" />
</RelativeLayout>
</RelativeLayout>
and here is how it is in my screen : http://s23.postimg.org/m3h37utuj/image.png
and here an example of other screen(tablet screen) : http://s24.postimg.org/hd0ibrahh/image.png
how can I fix this issue
Try this..
<LinearLayout
android:id="#+id/bar_bas"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:orientation="horizontal" >
<Button
android:layout_height="0dp"
android:layout_weight="0.2"
android:layout_height="wrap_content"
android:background="#drawable/right_left"
android:text="test"
android:textColor="#bfd2b0" />
<Button
android:id="#+id/btn_circle"
android:layout_height="0dp"
android:layout_weight="0.2"
android:layout_height="wrap_content"
android:background="#drawable/left_circle"
android:text="test"
android:textColor="#bfd2b0" />
<Button
android:layout_height="0dp"
android:layout_weight="0.2"
android:layout_height="wrap_content"
android:background="#drawable/circle"
android:text="test"
android:textColor="#bfd2b0" />
<Button
android:layout_height="0dp"
android:layout_weight="0.2"
android:layout_height="wrap_content"
android:background="#drawable/right_circle"
android:text="test"
android:textColor="#bfd2b0" />
<Button
android:layout_height="0dp"
android:layout_weight="0.2"
android:layout_height="wrap_content"
android:background="#drawable/right_left"
android:text="test"
android:textColor="#bfd2b0" />
</LinearLayout>
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/bar_bas"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#ff00ff"
android:text="test"
android:layout_weight="1"
android:textColor="#bfd2b0" />
<Button
android:id="#+id/btn_circle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#FF0000"
android:text="test"
android:layout_weight="1"
android:textColor="#bfd2b0" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#ff00AA"
android:text="test"
android:layout_weight="1"
android:textColor="#bfd2b0" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#ffaaff"
android:text="test"
android:layout_weight="1"
android:textColor="#bfd2b0" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#00AAff"
android:text="test"
android:layout_weight="1"
android:textColor="#bfd2b0" />
</LinearLayout>
Check this one, wrap_parent means it will take as less space as it can.

How to stretch the component to match the width of parent components in Android layout?

Below is the layout I designed.
Here is my code:
<LinearLayout
android:id="#+id/digitRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal" >
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="#string/login_button_1" />
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="#string/login_button_2" />
<Button
android:id="#+id/button3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="#string/login_button_3" />
</LinearLayout>
<LinearLayout
android:id="#+id/digitRow2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal" >
<Button
android:id="#+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/login_button_4" />
<Button
android:id="#+id/button5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/login_button_5" />
<Button
android:id="#+id/button6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/login_button_6" />
</LinearLayout>
<LinearLayout
android:id="#+id/digitRow3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal" >
<Button
android:id="#+id/button7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/login_button_7" />
<Button
android:id="#+id/button8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/login_button_8" />
<Button
android:id="#+id/button9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/login_button_9" />
</LinearLayout>
<LinearLayout
android:id="#+id/digitRow4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="#+id/buttonClear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/login_button_clear" />
<Button
android:id="#+id/button0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/login_button_0" />
<Button
android:id="#+id/buttonBack"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/login_button_back" />
</LinearLayout>
<LinearLayout
android:id="#+id/buttonRow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:orientation="horizontal"
android:padding="5dp" >
<Button
android:id="#+id/buttonChange"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/login_button_dhange" />
<Button
android:id="#+id/buttonDisable"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/login_button_disable" />
</LinearLayout>
The problem is that I want to stretch the bottom two buttons, "Change" and "Back", to match the width of the buttons above.
You can use weight on both of them, like this:
<LinearLayout
android:id="#+id/buttonRow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:orientation="horizontal"
android:padding="5dp" >
<Button
android:id="#+id/buttonChange"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.0"
android:text="#string/login_button_dhange" />
<Button
android:id="#+id/buttonDisable"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.0"
android:text="#string/login_button_disable" />
You probably want something like the code below.
I used a hard coded button width, but you probably want to put this in dimen.xml and reference it. I centered everything with gravity.
I tried this with weights as well, but the re-sizing is funny. As your screen gets wider the buttons get two wide.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/digitRow1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal" >
<Button
android:id="#+id/button1"
android:layout_width="100dp"
android:layout_height="match_parent"
android:text="1" />
<Button
android:id="#+id/button2"
android:layout_width="100dp"
android:layout_height="match_parent"
android:text="2" />
<Button
android:id="#+id/button3"
android:layout_width="100dp"
android:layout_height="match_parent"
android:text="3" />
</LinearLayout>
<LinearLayout
android:id="#+id/digitRow2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal" >
<Button
android:id="#+id/button4"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="4" />
<Button
android:id="#+id/button5"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="5" />
<Button
android:id="#+id/button6"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="6" />
</LinearLayout>
<LinearLayout
android:id="#+id/digitRow3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal" >
<Button
android:id="#+id/button7"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="7" />
<Button
android:id="#+id/button8"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="8" />
<Button
android:id="#+id/button9"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="9" />
</LinearLayout>
<LinearLayout
android:id="#+id/digitRow4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal" >
<Button
android:id="#+id/buttonClear"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="Clear" />
<Button
android:id="#+id/button0"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="0" />
<Button
android:id="#+id/buttonBack"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="Back" />
</LinearLayout>
<LinearLayout
android:id="#+id/buttonRow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:orientation="horizontal"
android:padding="5dp"
android:gravity="center_horizontal"
>
<Button
android:id="#+id/buttonChange"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:text="Change" />
<Button
android:id="#+id/buttonDisable"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:text="Disable" />
</LinearLayout>
Try to use weight like below. Also use margins to tweak the positions of the buttons.
<LinearLayout
android:id="#+id/buttonRow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:orientation="horizontal"
android:padding="5dp" >
<Button
android:id="#+id/buttonChange"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.0"
android:text="#string/login_button_dhange" />
<Button
android:id="#+id/buttonDisable"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.0"
android:text="#string/login_button_disable" />

Categories

Resources