Issue
I have images created in my res/drawable
directory with appropriate hdpi
, mdpi
, xhdpi
, and xxhdpi
sizings, and I would like to use them instead of regular buttons. I've done that part, but I need some help with the layout and formatting. I'll write my questions first, and then I'll post code and two screenshots below. Any advice is appreciated. Thanks!
Details on my device and the images:
Nexus 5 running Lollipop.
hdpi
A, B, C, D are 96x96. E is 72x72
mdpi
A, B, C, D are 64x64. E is 48x48.
xhdpi
A, B, C, D are 128x128. E is 96x96.
xxhdpi
A, B, C, D are 192x192. E is 144x144.
Questions:
1) Why has button E on the last row stretched horizontally? Button E is a square with rounded edges, just like all the others, but it is scaled down. Why did it stretch, and how can I fix it?
2) How can I arrange the drawables with space between them that will adjust dynamically based on screen size to keep the proportions the same? (See Picture 2 below)
fragment_main.xml
: (See Picture 1 below to see how this looks)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/fragmentMain"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">
<TableLayout
android:id="@+id/fragmentMainTableLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<TableRow
android:gravity="center_horizontal"
android:layout_weight="0">
<Button
android:id="@+id/buttonA"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/a_selector"/>
<Button
android:id="@+id/buttonB"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/b_selector"/>
</TableRow>
<TableRow
android:gravity="center_horizontal"
android:layout_weight="0">
<Button
android:id="@+id/buttonC"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/c_selector"/>
<Button
android:id="@+id/buttonD"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/d_selector"/>
</TableRow>
<TableRow
android:gravity="center|bottom"
android:layout_weight="0">
<Button
android:id="@+id/buttonE"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/e_selector"/>
</TableRow>
</TableLayout>
</LinearLayout>
Picture 1, the current layout:
Picture 2, the desired layout (but with button E properly shaped):
Solution
try this. hope it helps u...
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/fragmentMain"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical" >
<TableLayout
android:id="@+id/fragmentMainTableLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center" >
<TableRow
android:layout_weight="1"
android:gravity="center|bottom"
android:weightSum="4" >
<Button
android:id="@+id/buttonA"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="@drawable/ic_launcher" />
<Button
android:id="@+id/buttonB"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="@drawable/ic_launcher" />
</TableRow>
<TableRow
android:layout_weight="0"
android:gravity="center_horizontal"
android:weightSum="4" >
<Button
android:id="@+id/buttonC"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="@drawable/ic_launcher" />
<Button
android:id="@+id/buttonD"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="@drawable/ic_launcher" />
</TableRow>
<TableRow
android:layout_weight="1"
android:gravity="center" >
<Button
android:id="@+id/buttonE"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0"
android:background="@drawable/ic_launcher" />
</TableRow>
</TableLayout>
</LinearLayout>
convert ur image like this.
Answered By - M S Gadag
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.