як змінити розмір піктограми drawableLeft на кнопці?


80

Я додав кілька піктограм на 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>

Ви можете щось пояснити щодо своєї проблеми? завантажити кілька екранів і код, можливо?
Перемислав Яблонський

1
Змінити розмір самої піктограми ..?
JamesSwinton

@JamesSwinton так, я поставив поруч із кнопкою.
Arda Çebi

@PrzemyslawJablonski Додано скріншот деталей.
Arda Çebi

1
Так, я мав на увазі взяти фактичний малюнок та зменшити зображення до бажаного розміру.
JamesSwinton

Відповіді:


205

Оберніть свій ресурс у графічний файл, який визначає бажаний розмір, подібний до:

<?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тегу


81
@MuhammedRefaat Будьте обережні з цим рішенням, атрибут width та height сумісний лише з API 23 або новішою версією, тому він не працює з Lollipop та під версією.
Едуардо Е.Р.

1
@ EduardoE.R. вау, я цього не знав, радий, що ти мені сказав, дякую
Мухаммед Рефаат

@ EduardoE.R. чи можете ви порадити мені, як зробити сумісні атрибути ширини та висоти з версією нижче 23, щоб я міг показати піктограму однакового розміру в льодянику та під версією, велике спасибі заздалегідь
Amit Verma

1
@AmitVerma це рішення сумісне з версією нижче 23, я маю на увазі, воно не вийде з ладу, але не матиме однакового розміру. Я справді не знаю, чи є інший кращий підхід. Можливо, ви можете використовувати інший макет для цієї версії API і використовувати тег Image, який має для нього поведінку кнопки, ви знаєте, подія onclick, подія onPress ... вибачте, якщо це не справді гарне рішення.
Eduardo ER

Як новачок, я не розумію, що саме робити. Будь ласка, додайте більше деталей.
Minimus Heximus

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

6

Використання розширення Kotlin:

Додайте це, щоб ваш код залишався чистим та багаторазовим. Якщо ви не вкажете нічого або 0 для ідентифікатора, це очистить витягуване. (Кнопка розширює 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)
}


5

Додавши до чудової відповіді DroidBender. Його рішення не виходить з ладу на API 21, тому його все ще можна використовувати навіть без додавання Build.VERSION.SDK_INTкоду. Ось як виглядає рішення із використанням стандартного ресурсу зображення на API 21 (з використанням висоти тексту як параметра розміру).

введіть тут опис зображення

І ось як це виглядає на API 23+

введіть тут опис зображення

Це все ще дуже хороший варіант, навіть якщо min API <23.


1
Ну, це багато в чому залежить від того, що можна малювати, воно може бути просто прихованим або величезним. Зараз API <23 становить близько 15% за межами США.
htafoya

1
@htafoya Хороший момент. Думаю, я мав би спеціально сказати про об’єкт зображення. Я оновив свою публікацію.
lookingStillness

@seekingStillness Ні, це НЕ відображатиметься коректно у всіх випадках в API <23, я просто перевірив це, і моя піктограма охоплювала половину екрана. Для API <23 відповідь Orbite працює
CDrosos

@CDrosos, про який я згадав у своїй відповіді, "використовуючи стандартний ресурс зображення". Я підозрюю, що ви не використовуєте стандартний імпортований графічний об’єкт із Android Studio.
lookingStillness

Що таке стандартний об’єкт зображення? Я використовував растрове зображення PNG. На мій погляд, краще використовувати інший підхід нижче API 23. Краще будь у безпеці
CDrosos

5

Поки значок являє собою вектор активів, йти в векторний файл і змінити 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 та pivotY в тег групи, щоб зменшити розмір піктограми таким чином:

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

Ви можете керувати розміром піктограми, змінюючи масштабX та масштабY.

Це корисно не лише у випадку з малюнками, але в будь-якому місці, де використовується піктограма, і де непросто знайти рішення для стилізації для зменшення розміру піктограми, як, наприклад, AlertDialogue.

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.