如何將材質按鈕與其他UI元素對齊

Question

我無法將默認材質按鈕與UI的其他元素對齊。事實上，我已經看過了Android的源代碼以及按鈕的背景包含插圖點擊時能夠繪製陰影和處理按鈕的海拔：

<inset xmlns:android="http://schemas.android.com/apk/res/android" 
    android:insetLeft="@dimen/abc_button_inset_horizontal_material" 
    android:insetTop="@dimen/abc_button_inset_vertical_material" 
    android:insetRight="@dimen/abc_button_inset_horizontal_material" 
    android:insetBottom="@dimen/abc_button_inset_vertical_material"> 
    <shape android:shape="rectangle"> 
     <corners android:radius="@dimen/abc_control_corner_material" /> 
     <solid android:color="@android:color/white" /> 
     <padding android:left="@dimen/abc_button_padding_horizontal_material" 
      android:top="@dimen/abc_button_padding_vertical_material" 
      android:right="@dimen/abc_button_padding_horizontal_material" 
      android:bottom="@dimen/abc_button_padding_vertical_material" /> 
    </shape> 
</inset> 

所以，我有非常基本的以下佈局：

<?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" 
    android:padding="16dp" 
    > 
    <View 
     android:layout_width="match_parent" 
     android:layout_height="200dp" 
     android:background="#123456" 
     /> 
    <Button 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="test button alignment" 
     /> 
    <View 
     android:layout_width="match_parent" 
     android:layout_height="200dp" 
     android:background="#123456" 
     /> 
</LinearLayout> 

正如你所看到的，按鈕的左邊緣不與其他視圖的左邊緣對齊。

所以我的問題是，有沒有辦法來擺脫這些插圖的無鬆動默認的Android按鍵開箱處理有UI的影子/仰角以及對齊？

謝謝！

Answer 1

有也是災區的事情。按鈕的可點擊面積比圖形大。

您的佈局已經有填充，所以按鈕很容易有空間繪製陰影。你所要做的就是從按鈕的背景中移除水平插入。

一般情況下比較複雜。你應該：從按鈕的背景

• 刪除插圖，
• 記得要經常添加一些填充/保證金周圍的小部件留出空間陰影，
• 擴展打RECT捕捉到整個可點擊區域的點擊。

一兩件事情很簡單，最後一點可以通過例如getHitRect（）來完成：

public void getHitRect(@NonNull Rect outRect) { 
    if (touchMargin == null) { 
     super.getHitRect(outRect); 
     return; 
    } 
    outRect.set(getLeft() - touchMargin.left, getTop() - touchMargin.top, getRight() + touchMargin.right, getBottom() + touchMargin.bottom); 
} 

你的情況下，也很容易使用碳（它幾乎是我寫的解決 - 刪除鑲石，增加了自定義的命中RECT）：

<?xml version="1.0" encoding="utf-8"?> 
<carbon.widget.LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical" 
    android:padding="16dp"> 

    <View 
     android:layout_width="match_parent" 
     android:layout_height="200dp" 
     android:background="#123456" /> 

    <carbon.widget.Button 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_marginBottom="8dp" 
     android:layout_marginTop="8dp" 
     android:text="test button alignment" /> 

    <View 
     android:layout_width="match_parent" 
     android:layout_height="200dp" 
     android:background="#123456" /> 
</carbon.widget.LinearLayout> 

這裏是它的外觀與調試模式。紅線顯示延長命中矩。綠線是視圖邊界。

Answer 2

請查看下面的XML，我加入到重視參與android:layout_marginLeft="-4dip"

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:orientation="vertical" 
android:padding="16dp"> 

<View 
    android:id="@+id/te" 
    android:layout_width="match_parent" 
    android:layout_height="200dp" 
    android:background="#123456" /> 

<Button 
    android:id="@+id/bu" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_below="@+id/te" 
    android:text="test button alignment" 
    android:layout_marginLeft="-4dip" 
    /> 

<View 
    android:layout_width="match_parent" 
    android:layout_height="200dp" 
    android:background="#123456" 
    android:layout_below="@+id/bu" 
    /> 
</RelativeLayout>