GridLayout中具有drawableLeft的按钮

时间:2018-10-07 13:22:22

标签: android button drawable android-gridlayout

我有一个带有6个按钮的GridLayout:

enter image description here

当我尝试为按钮设置drawableLeft属性时,我有以下行为: enter image description here

如何自动缩放可绘制对象,以便所有按钮都可见?

布局为:

  <GridLayout
    android:orientation="horizontal"
    android:background="#AFAFAF"
    android:layout_width="match_parent"
    android:layout_margin="20dp"
    android:columnCount="4"
    android:rowCount="3"
    android:layout_weight="10"
    android:layout_height="0dp">
    <Space 
    android:layout_column="0"
    android:layout_columnWeight="1.5"
    android:layout_row="0"
    android:layout_rowWeight="1" />
    <Space 
    android:layout_column="2"
    android:layout_columnWeight="2"
    android:layout_row="0"
    android:layout_rowWeight="1" />
    <Space 
    android:layout_column="3"
    android:layout_columnWeight="1.5"
    android:layout_row="0"
    android:layout_rowWeight="1" />   
    <Button
        android:id="@+id/PageHome_Learn"
        android:layout_column="1"
        android:layout_columnWeight="2"
        android:layout_row="0"
        android:layout_rowWeight="1"
        android:drawableLeft="@drawable/MenuLearn"
        android:layout_margin="@dimen/TextPadding"
        android:text="@string/PageHome_LearnText"
        style="@style/Button" />
    <Button
        android:id="@+id/PageHome_Piano"
        android:layout_column="2"
        android:layout_columnWeight="2"
        android:layout_row="0"
        android:layout_rowWeight="1"
        android:layout_margin="@dimen/TextPadding"
        android:text="@string/PageHome_PianoText"
        style="@style/Button" />
    <Space 
    android:layout_column="3"
    android:layout_columnWeight="1.5"
    android:layout_row="0"
    android:layout_rowWeight="1" />
    <Button 
        android:id="@+id/PageHome_SimpleGame"
        android:layout_column="1"
        android:layout_columnWeight="2"
        android:layout_row="1"
        android:layout_rowWeight="1"
        android:layout_margin="@dimen/TextPadding"
        android:text="@string/PageHome_PractiseText"
        style="@style/Button" />
    <Button 
        android:id="@+id/PageHome_AgainstTheClock"
        android:layout_column="2"
        android:layout_columnWeight="2"
        android:layout_row="1"
        android:layout_rowWeight="1"
        android:layout_margin="@dimen/TextPadding"
        android:text="@string/PageHome_AgainstTheClockText"
        style="@style/Button" />
    <Button
        android:id="@+id/PageHome_Scores"
        android:layout_column="1"
        android:layout_columnWeight="2"
        android:layout_row="2"
        android:layout_rowWeight="1"
        android:layout_margin="@dimen/TextPadding"
        android:text="@string/PageHome_ScoreText"
        style="@style/Button" />
    <Button
        android:id="@+id/PageHome_Settings"
        android:layout_column="2"
        android:layout_columnWeight="2"
        android:layout_row="2"
        android:layout_rowWeight="1"
        android:layout_margin="@dimen/TextPadding"
        android:text="@string/PageHome_SettingsText"
        style="@style/Button" />

样式按钮对行为没有影响。 我找不到任何属性可将drawable限制为按钮高度。

2 个答案:

答案 0 :(得分:0)

您的可绘制对象尺寸很大。因为当您使用drawableLeft类型属性时,Android会在其完整尺寸上显示可绘制的内容。

如果仅需要在xml中设置drawable,则必须在按钮左侧使用ImageView并通过为ImageView设置宽度和高度来控制尺寸。

或者,您可以通过代码设置drawable并可以控制其尺寸,如下所示:

Drawable btnOneDrawable = ContextCompat.getDrawable(R.drawable.MenuLearn);
btnOneDrawable.setBounds(0,0,40,40);
buttonOne.setCompoundDrawables(btnOneDrawable, null, null, null);

更新
在xml中尝试一下。在布局中更改Button部分。另外,您还必须将可绘制的轮廓设置为此RelativeLayout而不是按钮。

<RelativeLayout
    android:id="@+id/PageHome_Learn"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_column="1"
    android:layout_columnWeight="2"
    android:layout_row="0"
    android:layout_rowWeight="1"
    android:layout_margin="@dimen/TextPadding">


    <Button
        android:id="@+id/btnPageHome_Learn"
        android:layout_centerInParent="true"
        android:text="@string/PageHome_LearnText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

    <ImageView
        android:src="@drawable/MenuLearn"
        android:layout_toLeftOf="@+id/btnPageHome_Learn"
        android:layout_centerVertical="true"
        android:layout_marginRight="10dp"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</RelativeLayout>

答案 1 :(得分:0)

这是我从以下代码中得到的内容,我想您希望实现相同的目的。只需使用复合TextView。

Grid layout screenshot

<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_rowSpan="12"
    android:columnCount="3"
    android:layout_weight="3"
    android:rowCount="3">

    <TextView
        style="@style/ButtonStyle"
        android:text="Button" />
    <TextView
        style="@style/ButtonStyle"
        android:text="Button" />
    <TextView
        style="@style/ButtonStyle"
        android:text="Button" />
    <TextView
        style="@style/ButtonStyle"
        android:text="Button" />
    <TextView
        style="@style/ButtonStyle"
        android:text="Button" />
    <TextView
        style="@style/ButtonStyle"
        android:text="Button" />
    <TextView
        style="@style/ButtonStyle"
        android:text="Button" />
</GridLayout>


// the code for ButtonStyle in the styles.xml file
<style name="ButtonStyle">
    <item name="android:layout_width">wrap_content</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:drawableStart">@drawable/ic_library</item>
    <item name="android:drawableLeft">@drawable/ic_library</item>
    <item name="android:drawablePadding">8dp</item>
    <item name="android:layout_columnWeight">1</item>
    <item name="android:textSize">16sp</item>
    <item name="android:textStyle">bold</item>
</style>