hi i am developing a small calculator app and i want to remove spacing between rows and columns of the button i want calculator buttons to be attached to each other.just like floor tiles i am using Grid Layout but still there is small amount of space left between any two buttons
This is layout xml file:
<?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" >
<EditText
android:id="#+id/calc_board"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:inputType="text"/>
<GridLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_margin="0dp"
android:layout_weight="2"
android:columnCount="4"
android:rowCount="5"
android:useDefaultMargins="false" >
<Button
android:id="#+id/clear_btn"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_column="0"
android:layout_row="0"
android:text="#string/clear_btn"
android:textSize="25sp" />
<Button
android:id="#+id/cross_btn"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_column="1"
android:layout_row="0"
android:drawableLeft="#drawable/ic_action_backspace"
android:drawableStart="#drawable/ic_action_backspace"
android:textSize="20sp" />
<Button
android:id="#+id/divide_btn"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_column="2"
android:layout_row="0"
android:text="#string/divide_btn"
android:textSize="30sp" />
<Button
android:id="#+id/multiply_btn"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_column="3"
android:layout_row="0"
android:text="#string/mult_btn"
android:textSize="30sp" />
<Button
android:id="#+id/seven_btn"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_column="0"
android:layout_row="1"
android:text="#string/seven_btn"
android:textSize="25sp" />
<Button
android:id="#+id/eight_btn"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_column="1"
android:layout_row="1"
android:text="#string/eight_btn"
android:textSize="25sp" />
</GridLayout>
</LinearLayout>
It looks like it might be because you are setting your buttons to be specific sizes. I'll explain in the horizontal direction for simplicity, but the same thing is essentially happening in the vertical direction. For horizontal direction, you are specifying 80dp as the button width, but you have your gridlayout width set to match_parent. If your buttons don't fill the width of the total actual size allocated to them by the grid layout based on it's total width (which in the layout you have defined is determined by the width of the screen), you could end up with extra space around the buttons.
It look like you seem to specify a fixed width and height for button sizes. If you use specific height and width it may look different on different screens.
You can use LinearLayout instead of GridLayout like below.
I think this might help you.. :)
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<EditText
android:id="#+id/calc_board"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:inputType="text" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="#+id/clear_btn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:text="Clear"
android:textSize="25sp" />
<Button
android:id="#+id/clear_bt"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:text="Clear"
android:textSize="25sp" />
<Button
android:id="#+id/clear_bn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:text="Clear"
android:textSize="25sp" />
<Button
android:id="#+id/clea"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:text="Clear"
android:textSize="25sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="#+id/clea1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:text="Clear"
android:textSize="25sp" />
<Button
android:id="#+id/clea2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:text="Clear"
android:textSize="25sp" />
<Button
android:id="#+id/clea3r_bn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:text="Clear"
android:textSize="25sp" />
<Button
android:id="#+id/clea4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:text="Clear"
android:textSize="25sp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
Related
This is my LayoutActivity, and above the LinearLayout where are the "No, Name, Price and Change 24H." appear a big gap on my phone (Samsung S7), look here. On my Android Studio virtual machine, there isn't one, look here. What is causing this gap and how to fix it?
I include the LayoutActivity code:
<?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-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".HomeActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#android:color/white"
android:elevation="10dp"
android:weightSum="3">
<Button
android:id="#+id/home_button"
style="#style/Widget.AppCompat.Button.Borderless"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_weight="1"
android:background="#5078909c "
android:text="Overview"
android:textStyle="bold" />
<Button
android:id="#+id/portfolio_button"
style="#style/Widget.AppCompat.Button.Borderless"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_weight="1"
android:background="#android:color/white"
android:text="Portfolio" />
<Button
android:id="#+id/settings_button"
style="#style/Widget.AppCompat.Button.Borderless"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentTop="true"
android:layout_weight="1"
android:background="#android:color/white"
android:text="Settings" />
</LinearLayout>
<Button
android:id="#+id/refresh_button"
style="#style/Widget.AppCompat.Button.Borderless"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
android:layout_marginStart="0dp"
android:text="Refresh" />
<ListView
android:id="#+id/CoinList"
android:layout_width="match_parent"
android:layout_height="385dp"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
android:layout_marginBottom="48dp" >
</ListView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="30dp"
android:layout_above="#+id/CoinList"
android:background="#android:color/white"
android:layout_alignParentEnd="true"
android:elevation="10dp"
android:orientation="horizontal">
<TextView
android:layout_width="60dp"
android:layout_height="30dp"
android:layout_alignParentStart="true"
android:layout_below="#+id/Background_for_buttons"
android:layout_weight="1"
android:background="#803f51b5"
android:gravity="center"
android:text="No"
android:textColor="#FF000000"
android:textStyle="bold" />
<TextView
android:id="#+id/textView2"
android:layout_width="128dp"
android:layout_height="30dp"
android:layout_alignParentStart="true"
android:layout_below="#+id/Background_for_buttons"
android:layout_weight="1"
android:background="#803f51b5"
android:gravity="center"
android:text="NAME"
android:textColor="#ff000000"
android:textStyle="bold" />
<TextView
android:id="#+id/textView4"
android:layout_width="128dp"
android:layout_height="30dp"
android:layout_below="#+id/Background_for_buttons"
android:layout_centerHorizontal="true"
android:layout_weight="1"
android:background="#803f51b5"
android:gravity="center"
android:text="PRICE"
android:textColor="#ff000000"
android:textStyle="bold" />
<TextView
android:id="#+id/text_view_test"
android:layout_width="128dp"
android:layout_height="30dp"
android:layout_alignParentEnd="true"
android:layout_below="#+id/Background_for_buttons"
android:layout_weight="1"
android:background="#803f51b5"
android:gravity="center"
android:text="CHANGE 24H."
android:textColor="#ff000000"
android:textStyle="bold" />
</LinearLayout>
</RelativeLayout>
Your ListView has a fixed height and is aligned with parent's bottom. Your LinearLayout with headers is put on top of the ListView. So based on vertical resolution of the screen there may or may not be a gap between the LinearLayout and the top of the screen. More specifically, if the screen is taller than 30+385 dp you'll see a gap.
What you probably want to do is align the headers layout with the top of the parent, align the list to the bottom of the headers and make lists's height "match_parent"
Edit: didn't notice the refresh button. You may also need to put
android:layout_above="#+id/refresh_button"
on the ListView
My project had fragment which has Main Relative Layout. Relative Layout had layout width and height match_parent. It contains Grid Layout at the top. After grid layout linear layout is added to separate the remaining portion of screen.
Below of the linear layout grid view is added. Here is the problem arrived.
My grid view contains nine element. On small device it fill entire screen, but when device screen is large enough the the blank space is getting added at the end. I want to fill the entire screen with 9 element on every device, may be device size is small or large.
<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="fill_parent"
android:orientation="vertical"
tools:context="yieldcurve.jamakharch.SavingsFragment">
<GridLayout
android:id="#+id/gl_savings_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:columnCount="3"
android:padding="2dp"
android:rowCount="2">
<yieldcurve.jamakharch.util.JTextViewRegular
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_columnWeight="9"
android:layout_gravity="center_horizontal"
android:layout_marginTop="6dp"
android:layout_row="0"
android:text="#string/total_savings"
android:textColor="#color/colorBlue"
android:textSize="13sp" />
<View
android:layout_width="1dp"
android:layout_height="75dp"
android:layout_column="1"
android:layout_columnWeight="0.1"
android:layout_marginBottom="3dp"
android:layout_marginTop="3dp"
android:layout_row="0"
android:layout_rowSpan="2"
android:background="#color/colorLine" />
<ImageView
android:id="#+id/iv_savings_refresh"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_column="2"
android:layout_columnWeight="22"
android:layout_gravity="center_horizontal"
android:layout_marginTop="4dp"
android:layout_row="0"
android:src="#mipmap/ic_reset" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_columnWeight="200"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="3dp"
android:layout_marginTop="2dp"
android:layout_row="1"
android:background="#color/colorGrey">
<ImageView
android:id="#+id/iv_savings_minus"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_gravity="center"
android:layout_marginBottom="3dp"
android:layout_marginLeft="4dp"
android:layout_marginTop="3dp"
android:src="#mipmap/ic_minus" />
<LinearLayout
android:layout_width="1dp"
android:layout_height="25dp"
android:layout_marginBottom="5dp"
android:layout_marginLeft="4dp"
android:layout_marginTop="5dp"
android:background="#color/colorLine" />
<yieldcurve.jamakharch.util.JCustomBoldTextView
android:id="#+id/tv_total_savings_value"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="10dp"
android:layout_marginRight="2dp"
android:gravity="center"
android:text="200."
android:textColor="#color/colorTracklabels"
android:textSize="20sp" />
<yieldcurve.jamakharch.util.JCustomBoldTextView
android:id="#+id/tv_saving_unit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="L"
android:textColor="#color/colorTracklabels"
android:textSize="20sp" />
<LinearLayout
android:layout_width="1dp"
android:layout_height="25dp"
android:layout_marginBottom="5dp"
android:layout_marginLeft="10dp"
android:layout_marginTop="5dp"
android:background="#color/colorLine" />
<ImageView
android:id="#+id/iv_savings_plus"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_gravity="center"
android:layout_marginLeft="4dp"
android:layout_marginRight="4dp"
android:src="#mipmap/ic_plus" />
</LinearLayout>
<ImageView
android:id="#+id/iv_show_saving_chart"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_column="2"
android:layout_columnWeight="2"
android:layout_gravity="center"
android:layout_marginTop="2dp"
android:layout_row="1"
android:src="#mipmap/ic_show_map" />
</GridLayout>
<LinearLayout
android:id="#+id/savings_seperator"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_below="#+id/gl_savings_header"
android:layout_marginLeft="3dp"
android:layout_marginRight="3dp"
android:layout_marginTop="3dp"
android:background="#color/colorLine"
android:orientation="horizontal" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="#+id/savings_seperator">
<GridView
android:id="#+id/gv_track_savings"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:layout_marginTop="4dp"
android:layout_weight="1"
android:gravity="center"
android:numColumns="3"
android:paddingLeft="4dp"></GridView>
</LinearLayout>
change android:layout_height="wrap_content" to android:layout_height="match_parent" and your parent viewgroup is Relative layout so android:layout_weight="1" not work.
android:layout_weight is used for only Linear layout.
I'm inexperienced with Android and working on a layout that is supposed to have a bottom area with 3 buttons displayed this way:
I managed to almost get it like this, except that depending on the screen, the bottom buttons will be either overlapping each other or too far off. The buttons are supposed to be perfectly aligned below the "APPLY" button, but I can't seem to get it right.
Here's my current code:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="20dp">
<RelativeLayout
android:id="#+id/relapply"
android:layout_width="match_parent"
android:layout_height="50dp"
android:gravity="center_horizontal"
android:orientation="horizontal">
<Button
android:id="#+id/apply"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ripple_buttons_carousel"
android:text="#string/apply_button"
android:textSize="15sp"
android:textColor="#android:color/white"
android:width="320dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="bottom"
android:layout_below="#id/relapply">
<Button
android:id="#+id/discard"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ripple_buttons_carousel"
android:text="#string/discard_button"
android:textSize="15sp"
android:textColor="#android:color/white"
android:layout_marginStart="30dp"
android:width="154dp"
android:layout_alignParentStart="true"/>
<RelativeLayout
android:layout_width="12dp"
android:layout_height="30dp"
android:layout_toLeftOf="#id/save">
</RelativeLayout>
<Button
android:id="#+id/save"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ripple_buttons_carousel"
android:text="#string/save_button"
android:textSize="15sp"
android:textColor="#android:color/white"
android:layout_marginEnd="30dp"
android:width="154dp"
android:layout_alignParentEnd="true" />
</RelativeLayout>
</RelativeLayout>
This is my code for the layout in which the buttons are in. And then everything's inside a linear layout xml test file I made. Any tips on how to improve this?
Thanks!
first of all you have way to much relative layouts, much more than you need.
you can try this layout here (I removed the background and hardcoded the text for demonstration purposes)
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="8dp">
<Button
android:id="#+id/apply"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:text="Top Button"
android:textColor="#android:color/white"
android:textSize="15sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/apply"
android:orientation="horizontal">
<Button
android:id="#+id/discard"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Bottom Left Button"
android:textColor="#android:color/white"
android:textSize="15sp" />
<Button
android:id="#+id/save"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Bottom Right Button"
android:textColor="#android:color/white"
android:textSize="15sp" />
</LinearLayout>
</RelativeLayout>
you can set the layout margins on the outer relative layout (e.g. android:layout_margin="8dp"
the layout works like this:
in the top row there is just the top Button. Below it there is a horizontal linear layout containing two buttons with
android:layout_width="0dp"
android:layout_weight="1"
This ensures both buttons span equally horizontal (because they have the same width). If you want the whole layout have a specific width just set the android:layout_width="match_parent" from the relative layout to android:layout_width="320dp"
You can do as follow:
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="16dp"
android:background="#color/background_floating_material_dark">
<Button
android:id="#+id/apply"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/ripple_buttons_carousel"
android:text="#string/apply_button"
android:textSize="15sp"
android:textColor="#android:color/white"
android:layout_marginBottom="10dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2">
<Button
android:id="#+id/discard"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#drawable/ripple_buttons_carousel"
android:text="#string/discard_button"
android:textSize="15sp"
android:textColor="#android:color/white"
android:layout_weight="0.9" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.2"></LinearLayout>
<Button
android:id="#+id/save"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#drawable/ripple_buttons_carousel"
android:text="#string/save_button"
android:textSize="15sp"
android:textColor="#android:color/white"
android:layout_weight="0.9" />
</LinearLayout>
</LinearLayout>
And the output is near about this:
You can also use following code.....
This is simple and easy.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="5dp">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Apply" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:orientation="horizontal"
android:weightSum="2">
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:text="Discard" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_weight="1"
android:text="Save" />
</LinearLayout>
</LinearLayout>
I want to place 9 buttons in my activity with two conditions:
1.If the screen is small the buttons get scroll.
2.If the screen enough big to fit all of them in one go then they get stretched to fill the screen.
I tried but its not working. thanks.
screenshot of layout
<include
android:id="#+id/toolbar"
layout="#layout/appbar"></include>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/toolbar">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#fff0fd"
android:orientation="vertical"
android:layout_margin="8dp">
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/First_Semester"
android:textStyle="bold" />
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/Second_Semester"
android:textStyle="bold" />
<Button
android:id="#+id/button3"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:onClick="onButtonClick"
android:text="#string/Third_Semester"
android:textStyle="bold" />
<Button
android:id="#+id/button4"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/Forth_Semester"
android:textStyle="bold" />
<Button
android:id="#+id/button5"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/Fifth_Semester"
android:textStyle="bold" />
<Button
android:id="#+id/button6"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/Sixth_Semester"
android:textStyle="bold" />
<Button
android:id="#+id/button7"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/Seventh_Semester"
android:textStyle="bold" />
<Button
android:id="#+id/button8"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/Eighth_Semester"
android:textStyle="bold" />
<Button
android:id="#+id/button9"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/Gate"
android:textStyle="bold" />
</LinearLayout>
</ScrollView>
</RelativeLayout>
You have to make different layouts for them, by creating folders in your res folder named layout-small , layout-large, as described here: Supporting Multiple Screens
the folder named 'layout' will be used ofcourse. But, when you create a folder named layout-small, that one will be used instead if the screen size is lower than 470dp x 320dp , which is the minimum resolution for layout-normal.
As for the stretching, use the layout weights and weightsum in a linearlayout for the layouts that look like they can fit in the preview.
Remove the weight parameters, and set layout_height to wrap_content, like so:
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#fff0fd"
android:orientation="vertical"
android:layout_margin="8dp">
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:text="#string/First_Semester"
android:textStyle="bold"/>
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:text="#string/Second_Semester"
android:textStyle="bold"/>
<Button
android:id="#+id/button3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:onClick="onButtonClick"
android:singleLine="true"
android:text="#string/Third_Semester"
android:textStyle="bold"/>
<Button
android:id="#+id/button4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:text="#string/Forth_Semester"
android:textStyle="bold"/>
<Button
android:id="#+id/button5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:text="#string/Fifth_Semester"
android:textStyle="bold"/>
<Button
android:id="#+id/button6"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:text="#string/Sixth_Semester"
android:textStyle="bold"/>
<Button
android:id="#+id/button7"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:text="#string/Seventh_Semester"
android:textStyle="bold"/>
<Button
android:id="#+id/button8"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:text="#string/Eighth_Semester"
android:textStyle="bold"/>
<Button
android:id="#+id/button9"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:text="#string/Gate"
android:textStyle="bold"/>
</LinearLayout>
</ScrollView>
You can preview different screen resolutions in the editor to determine which to make with or without a scrollview right here:
I gave the answer in this question a try, the only difference being that I'm using a vertical LinearLayout instead of horizontal:
Children in Linear Layout with equal padding
As such, I figured that I would swap around the width/height attributes so that width for all elements would be wrap_content, where as height would be match_parent. Is that how it should be?
Anyway, my weight selection is still causing my buttons to stretch in horrible ways.
Here is the xml file:
<LinearLayout
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"
android:gravity="center_horizontal"
android:orientation="vertical"
tools:context=".MainActivity" >
<ImageView
android:id="#+id/logo"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:scaleX="0.8"
android:scaleY="0.8"
android:src="#drawable/logo" />
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="0.4"
android:background="#drawable/button1_image"
android:onClick="button1" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="0.4"
android:background="#drawable/button2_image"
android:onClick="button2" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.4"
android:background="#drawable/button3_image"
android:onClick="button3" />
<Button
android:id="#+id/button4"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="0.4"
android:background="#drawable/button4_image"
android:onClick="button4" />
<Button
android:id="#+id/button5"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="0.4"
android:onClick="Button5"
android:text="Text"
android:textSize="26dp" />
</LinearLayout>
I feel like I'm close - what am I missing here?
If you want to prevent an item from being stretched, set it's height and width attributes to
android:layout_width="wrap_content"
android:layout_height="wrap_content"
So the buttons will only be as wide as the background image given.
If your background image is too large, that can be skewing things as well.
i don't know excetly what you require, but is this helpful to you?
<LinearLayout 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"
android:gravity="center_horizontal"
android:orientation="vertical" >
<ImageView
android:id="#+id/logo"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:scaleX="0.8"
android:scaleY="0.8"
android:src="#drawable/ic_launcher" />
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#drawable/ic_launcher"
android:onClick="button1" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#drawable/ic_launcher"
android:onClick="button2" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#drawable/ic_launcher"
android:onClick="button3" />
<Button
android:id="#+id/button4"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#drawable/ic_launcher"
android:onClick="button4" />
<Button
android:id="#+id/button5"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:onClick="Button5"
android:text="Text"
android:textSize="26dp" />
</LinearLayout>