如何更改按钮上的drawableLeft图标大小?


76

我在4个按钮上添加了一些图标,它们在按钮旁边看起来很大。那么如何调整它们的大小?我在按钮上使用了drawableLeft来添加图标。

可绘制对象称为交易,奖杯,拼图和扩音器。图标太大。content_main.xml文件:

    <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/content_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="tr.k12.evrim.evrimnews.MainActivity"
    tools:showIn="@layout/activity_main">




    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/frameLayout"
        android:layout_alignParentTop="true"
        android:layout_alignParentStart="true">


        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <Button
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="Giriş Yap"
                android:onClick="SignIn"
                android:textStyle="bold"
                style="@style/Widget.AppCompat.Button.Colored"/>




            </LinearLayout>


    </FrameLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="400dp"
        android:layout_below="@id/frameLayout"
        android:orientation="vertical">



    <Button
        android:text="Duyurular"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:layout_below="@+id/frameLayout"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="13dp"
        android:id="@+id/button2"
        android:drawableLeft="@drawable/megaphone" />

    <Button
        android:text="Kadromuz"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:layout_below="@+id/button2"
        android:layout_alignEnd="@+id/button2"
        android:layout_marginTop="13dp"
        android:id="@+id/button3"
        android:drawableLeft="@drawable/puzzle"/>

        <Button
            android:text="Başarılarımız"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:layout_marginTop="12dp"
            android:id="@+id/button5"
            android:drawableLeft="@drawable/trophy"/>


    <Button
        android:text="Ortaklarımız"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:layout_marginTop="12dp"
        android:id="@+id/button4"
        android:drawableLeft="@drawable/deal"/>




    </LinearLayout>

</RelativeLayout>

您能澄清有关您问题的任何信息吗?上载一些屏幕和代码?
Przemyslaw Jablonski

1
更改图标本身的大小。
JamesSwinton '16

@JamesSwinton是的,我放在按钮旁边。
ArdaÇebi'16

@PrzemyslawJablonski添加了详细信息截图。
ArdaÇebi'16

1
是的,我是说取实际的可绘制对象并将图像缩小到所需的尺寸。
JamesSwinton

Answers:


194

将资源包装在可绘制的可绘制内容中,该可绘制内容类似于以下内容:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

  <item
      android:drawable="@drawable/icon"
      android:width="@dimen/icon_size"
      android:height="@dimen/icon_size"
      />

</layer-list >

之后,在android:drawableLeft标签中使用此drawable


81
@MuhammedRefaat请谨慎使用此解决方案,该属性的widthheight仅与API 23或更高版本兼容,因此不适用于Lollipop及更低版本。
爱德华多ER

1
@ EduardoE.R。哇,我不知道,很高兴您告诉我,谢谢
穆罕默德·利法(Muhammed Refaat)

@ EduardoE.R。您能否指导我如何使23以下版本的属性宽度和高度兼容,所以我可以在棒棒糖和以下版本中显示相同大小的图标,在此先谢谢了
Amit Verma

1
@AmitVerma此解决方案与23以下版本兼容,我的意思是,它不会崩溃,但是大小不一样。我真的不知道是否还有更好的方法。也许您可以为该API版本使用其他布局,并使用具有按钮行为的Image标记,您知道onclick事件,onPress事件...对不起,如果听起来不是一个很好的解决方案。
Eduardo ER

1
像教堂一样工作!
Tzegenos

7

您可以通过编程方式(在此处)设置边界,如下所示

Drawable img = ActivityName.this.getContext().getResources().getDrawable(
            R.drawable.blue_line);
img.setBounds(left, top, right, bottom);
button.setCompoundDrawables(img, null, null, null);

6

请尝试以下方法。将可绘制对象声明为要使用的图标

    Drawable drawable = getResources().getDrawable(R.mipmap.youricon);
    drawable.setBounds(0, 0, (int) (drawable.getIntrinsicWidth() * 0.6),
            (int) (drawable.getIntrinsicHeight() * 0.6));
    ScaleDrawable sd = new ScaleDrawable(drawable, 0, 40, 40);
    youredittext1.setCompoundDrawables(null, null, sd.getDrawable(), null);
    drawable = getResources().getDrawable(R.mipmap.yourothericon);
    drawable.setBounds(0, 0, (int) (drawable.getIntrinsicWidth() * 0.6),
            (int) (drawable.getIntrinsicHeight() * 0.6));
    sd = new ScaleDrawable(drawable, 0, 40, 40);
    youredittext2.setCompoundDrawables(null, null, sd.getDrawable(), null);

5

添加到DroidBender的好答案。他的解决方案不会在API 21上崩溃,因此即使不添加Build.VERSION.SDK_INT代码也可以使用。这就是使用标准图像资产的解决方案在API 21上的外观(使用文本高度作为尺寸设置)。

在此处输入图片说明

这就是它在API 23+上的样子

在此处输入图片说明

即使min API <23,这仍然是一个非常好的选择。


1
好吧,这在很大程度上取决于可绘制对象,它可能只是被隐藏起来,或者是巨大的。目前,API <23大约占美国境外的15%。
htafoya

1
@htafoya好点。我想我应该特别说说图像资产。我已经更新了我的帖子。
seekStillness

@seekingStillness不,在API <23上的所有情况下,它都不会正确显示,我只是检查了一下,并且我的图标覆盖了屏幕的一半。对于API <23 Orbite,答案有效
CDrosos

@CDrosos我在回答中提到“使用标准图像资产”。我怀疑您没有使用来自Android Studio的标准导入的图像资产。
seekStillness

什么是标准图片资产?我正在使用位图png图像。我认为最好使用API​​ 23以下的其他方法。更好的是安全的
CDrosos

5

使用Kotlin扩展程序:

添加它以保持您的代码干净和可重复使用。如果您未传递任何内容或将0作为id传递,它将清除可绘制对象。(按钮扩展了TextView)

buttonView.leftDrawable(R.drawable.my_icon, R.dimen.icon_size)

// Button extends TextView
fun TextView.leftDrawable(@DrawableRes id: Int = 0, @DimenRes sizeRes: Int) {
    val drawable = ContextCompat.getDrawable(context, id)
    val size = resources.getDimensionPixelSize(sizeRes)
    drawable?.setBounds(0, 0, size, size)
    this.setCompoundDrawables(drawable, null, null, null)
}


4

只要图标是Vector资产,就可以进入vector文件并进行修改android:width,然后更改android:height@dimen/icon_size。然后在您的dimens.xml文件中为多个屏幕尺寸定义此资源。奇迹般有效


这是一个很好的选择-特别是对于单个用例。想象一下编写代码行来实现这么小的更改。
酋长

0

该解决方案适用于使用矢量图形图标的所有用例,并且还与以下23个版本兼容。

在xml中打开可绘制图标

可绘制的原始图标:

<vector 
    android:height="24dp"
    android:tint="?attr/colorControlNormal" 
    android:viewportHeight="24"
    android:viewportWidth="24" 
    android:width="24dp" 
    xmlns:android="http://schemas.android.com/apk/res/android">
    <path android:fillColor="@android:color/white" android:pathData="M11,18h2v-2h-2v2zM12,2C6.48,2 2,6.48 2,12s4.48,10 10,10 10,-4.48 10,-10S17.52,2 12,2zM12,20c-4.41,0 -8,-3.59 -8,-8s3.59,-8 8,-8 8,3.59 8,8 -3.59,8 -8,8zM12,6c-2.21,0 -4,1.79 -4,4h2c0,-1.1 0.9,-2 2,-2s2,0.9 2,2c0,2 -3,1.75 -3,5h2c0,-2.25 3,-2.5 3,-5 0,-2.21 -1.79,-4 -4,-4z"/>
</vector>

现在,使用组标签包装路径标签,并在组标签中添加属性scaleX,scaleY,pivotX和ivotY来缩小图标大小,如下所示:

<vector 
    android:height="24dp"
    android:tint="?attr/colorControlNormal" 
    android:viewportHeight="24"
    android:viewportWidth="24" 
    android:width="24dp" 
    xmlns:android="http://schemas.android.com/apk/res/android">
    <group
        android:scaleX="0.5"
        android:scaleY="0.5"
        android:pivotX="12"
        android:pivotY="12">
        <path
        android:fillColor="@android:color/white"
        android:pathData="M11,18h2v-2h-2v2zM12,2C6.48,2 2,6.48 2,12s4.48,10 10,10 10,-4.48 10,-10S17.52,2 12,2zM12,20c-4.41,0 -8,-3.59 -8,-8s3.59,-8 8,-8 8,3.59 8,8 -3.59,8 -8,8zM12,6c-2.21,0 -4,1.79 -4,4h2c0,-1.1 0.9,-2 2,-2s2,0.9 2,2c0,2 -3,1.75 -3,5h2c0,-2.25 3,-2.5 3,-5 0,-2.21 -1.79,-4 -4,-4z"/>
    </group>
</vector>

您可以通过更改scaleX和scaleY来控制图标的大小。

这不仅在可绘制对象的情况下有用,而且在使用图标的地方以及不容易找到减小图标大小的样式解决方案的地方(例如AlertDialogue)都非常有用。

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.