I have an image which looks like a checkbox, that i would like to align on top right hand corner of button. Have tried relative layout but could not achieve desired result. Any suggestion to achieve the desired result?
I have tried using Framelayout but the checbox image remains hidden
<FrameLayout
android:layout_marginLeft="10dp"
android:layout_marginTop="20dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/filter_check"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/checkmark"
android:layout_gravity="right"
/>
<Button
android:id="@+id/filter"
style="@style/Widget.Button.White.BlueText.BlueStroke"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Filter" />
</FrameLayout>
After Farouk's suggestions to use Button before image. Here is the code
<FrameLayout
android:layout_marginLeft="10dp"
android:layout_marginTop="20dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<Button
android:id="@+id/filter"
style="@style/Widget.Button.White.BlueText.BlueStroke"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Filter" />
<ImageView
android:id="@+id/filter_check"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/checkmark"
android:layout_gravity="top|right"
/>
</FrameLayout>
Here is what i see on designer.
Not sure how to move the checkbox image up and right.
In case you want the solution, here it is:
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="80dp" >
<Button
android:id="@+id/filter"
style="@style/Widget.Button.White.BlueText.BlueText.FrameImage"
android:layout_margin="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Sort" />
<ImageView
android:id="@+id/widget_title_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|right"
android:src="@drawable/checkmark" />
</FrameLayout>
<style name="Widget.Button.White.BlueText.BlueText.FrameImage" parent="@android:style/Widget.Button">
<item name="android:background">@drawable/white_button_blue_stroke_bg_selector</item>
<item name="android:gravity">center</item>
<item name="android:textColor">@color/white</item>
<item name="android:textAppearance">?android:attr/textAppearanceMedium</item>
</style>
Solution:
It look like this :
Just play with the android:paddingTop="-10dp"
as you like.
Here the code :
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/widget_icon"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Button
android:id="@+id/filter"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="7dp"
android:background="#0000FF"
android:gravity="center"
android:paddingBottom="25dp"
android:paddingTop="25dp"
android:text="Sort"
android:textColor="#FFFFFF" />
<ImageView
android:id="@+id/widget_title_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|right"
android:adjustViewBounds="true"
android:paddingTop="-10dp"
android:scaleType="fitStart"
android:src="@drawable/checkbtn" />
</FrameLayout>
Check this one, hopefully it will help you.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/main_widget"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="20dip"
android:focusable="true" >
<ImageView
android:id="@+id/icon"
android:layout_width="60dip"
android:layout_height="60dip"
android:layout_marginTop="8dp"
android:background="@drawable/ic_launcher"
android:scaleType="center" />
<CheckBox
android:id="@+id/checkBox1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="-10dip"
android:layout_toRightOf="@+id/icon"
android:gravity="center"
android:text="" />
</RelativeLayout>
EDIT If you want to move checkbox little further to imageview then increase the android:layout_marginLeft="-10dip"
to android:layout_marginLeft="-20dip"
. Just play with it. :)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With