Кнопка с текстом под значком (Android) - PullRequest
Новая
       35

Кнопка с текстом под значком (Android)

0 голосов
/ 25 января 2019

Я пытаюсь создать кнопку, подобную этой: image . Я только что попытался сделать простую кнопку и использовать атрибут android:drawableTop="@drawable/ic_my_icon, но таким образом я не могу изменить размер иконки :(

В моем проекте я использую привязку данных и макет ограничения, и в этом фрагменте я должен использовать более 5 подобных кнопок. Лучший способ, который я нашел, - это использование MaterialCardView с внутренним RelativeLayout. 

<com.google.android.material.card.MaterialCardView
    android:id="@+id/cardTranslationTraining"
    android:layout_width="@dimen/cardSize"
    android:layout_height="@dimen/cardSize"
    app:cardBackgroundColor="@drawable/card_color_selector">  <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <ImageView
            android:layout_width="60sp"
            android:layout_height="60sp"
            android:layout_centerHorizontal="true"
            android:layout_margin="5sp"
            app:srcCompat="@drawable/icon" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="10sp"
            android:gravity="center"
            android:text="Translate" />

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="3dp"
            android:layout_alignParentBottom="true"
            android:background="@color/colorPrimaryDark" />
    </RelativeLayout>
</com.google.android.material.card.MaterialCardView>

Но есть более 200 строк, и это выглядит ужасно!

Как я могу сделать это без большого вложения? Кто-нибудь может помочь?
Большое спасибо за вашу помощь :)

Ответы [ 2 ]

0 голосов
/ 22 февраля 2019

Попробуйте код ниже в макете: 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:background="#DDDDDD">
<android.support.v7.widget.CardView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="20dp"
    app:cardMaxElevation="2dp"
    app:cardElevation="2dp"
    android:translationZ="2dp">
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:padding="20dp">
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_like"/>
        <TextView
            android:layout_marginTop="10dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Like"/>
    </LinearLayout>
</android.support.v7.widget.CardView>

</LinearLayout>

Вот код выхода:

enter image description here

Я надеюсь, что эторабота для вас.

0 голосов
/ 25 января 2019

Просто создайте custom view component и используйте один и тот же макет в течение одного раза.И поместите свой пользовательский вид в макет XML, как показано ниже.Также Вы можете установить пользовательские атрибуты , такие как источник изображения кнопки и текст 

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    
    xmlns:custom="http://schemas.android.com/apk/res/com.example.customviews"> 

    <com.example.customviews.YourCustomView
     custom:showText="true"
     custom:labelPosition="left" /> 

    <com.example.customviews.YourCustomView
     custom:showText="true"
     custom:labelPosition="left" /> 

    <com.example.customviews.YourCustomView
     custom:showText="true"
     custom:labelPosition="left" /> 
</LinearLayout>

Источник компонента пользовательского просмотра

Класс пользовательского просмотра

...