如何完全向左或向右浮动/粘贴android按钮（包含图像）

Question

我尝试为我的应用程序进行设计。为了吸引用户的注意力，我试图想象一些有趣的东西。 我的计划是获得如下设计：

视觉元素：

• 红色区域是按钮
• 细圆圈是我稍后会出来的图片......

我的目标：

• 在创建活动时，按钮将从外部进入屏幕 屏幕的边界。 （他们可以按顺序一个接一个地来，因为 我不想对asynctasks，处理程序等感到疯狂。）
• 每个按钮的2个角将平滑地圆滑
• 重要和最后一个：当我点击一个按钮时，我想要它 屏幕隐藏在屏幕外方，反向操作。

在第一秒我已经遇到了问题。这里是：

如您所见，按钮和布局之间有一些空间。 当前的xml布局

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_marginTop="22dp"
        android:text="Button" />

</RelativeLayout>

我该如何解决这个问题？ 我将很高兴在此提出有关如何实现我的建议的建议。

Answer 1

好的，试试看：

drawable/corners.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape android:shape="rectangle">
            <corners android:topRightRadius="10dp" android:bottomRightRadius="10dp" />
            <solid android:color="#888888" />
        </shape>
    </item>
    <item android:state_focused="true">
        <shape android:shape="rectangle">
            <corners android:topRightRadius="10dp" android:bottomRightRadius="10dp" />
            <solid android:color="#888888" />
        </shape>
    </item>
    <item>
        <shape android:shape="rectangle">
            <corners android:topRightRadius="10dp" android:bottomRightRadius="10dp" />
            <solid android:color="#BBBBBB" />
        </shape>
    </item>
</selector>

与此：

layout/button.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_marginTop="22dp"
        android:background="@drawable/corners"
        android:text="Button" />

</RelativeLayout>

这是带有文字和图片的版本：

drawable/corner.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item>
        <shape android:shape="rectangle">
            <corners android:topRightRadius="10dp" android:bottomRightRadius="10dp" />
            <solid android:color="#BBBBBB"/>
        </shape>
    </item>
</selector>


drawable/corner_pressed.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item>
        <shape android:shape="rectangle">
            <corners android:topRightRadius="10dp" android:bottomRightRadius="10dp" />
            <solid android:color="#888888"/>
        </shape>
    </item>
</selector>


drawable/states.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:drawable="@drawable/corner_pressed" />
    <item android:drawable="@drawable/corner" />
</selector>

和主要布局：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="22dp"
        android:background="@drawable/states"
        android:clickable="true">

        <TextView
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_centerVertical="true"
            android:text="Button"
            />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_launcher"
            android:layout_toRightOf="@id/button1"
            />

        </RelativeLayout>

</RelativeLayout>