Android:对齐按钮右上角的图像

时间:2014-06-09 11:09:17

标签: android android-layout

我的图像看起来像一个复选框,我想在按钮的右上角对齐。尝试了相对布局但无法达到预期效果。有任何建议可以达到预期的效果吗?

Checkbox

What i want

我尝试使用Framelayout,但checbox图像仍然隐藏

 <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>

在Farouk建议在图像之前使用Button之后。这是代码

<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>

这是我在设计师身上看到的。

FrameLayout Output

不确定如何向上和向右移动复选框图像。

如果您需要解决方案,请点击此处:

<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>

解决方案:

Image

2 个答案:

答案 0 :(得分:10)

看起来像这样:

enter image description here

根据需要使用android:paddingTop="-10dp"

这里是代码:

<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>

答案 1 :(得分:3)

检查这个,希望它会对你有所帮助。 Here is the image

<?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>

编辑如果您想将复选框稍微移动到imageview,请将android:layout_marginLeft="-10dip"增加到android:layout_marginLeft="-20dip"。只是玩它。 :)