android: drawableLeft margem e / ou preenchimento


Respostas:


466

Como o Cephus mencionado android:drawablePadding, forçará o preenchimento apenas entre o texto e o drawable se o botão for pequeno o suficiente.

Ao colocar botões maiores, você pode usar android:drawablePaddingem conjunto com android:paddingLefte android:paddingRightforçar o texto e o desenho para dentro em direção ao centro do botão. Ajustando o preenchimento esquerdo e direito separadamente, você pode fazer ajustes muito detalhados no layout.

Aqui está um botão de exemplo que usa preenchimento para aproximar o texto e o ícone do que eles seriam por padrão:

<Button android:text="@string/button_label" 
    android:id="@+id/buttonId"
    android:layout_width="160dip"
    android:layout_height="60dip"
    android:layout_gravity="center"
    android:textSize="13dip"
    android:drawableLeft="@drawable/button_icon"
    android:drawablePadding="2dip"
    android:paddingLeft="30dip"
    android:paddingRight="26dip"
    android:singleLine="true"
    android:gravity="center" />  

22
android: paddingLeft = "30dip" android: paddingRight = "26dip" são essenciais aqui!
— IgorGanapolsky

4
isso não está relacionado à questão, mas o android: gravity = "center" manterá o texto alinhado com o centro do drawable!
— cwhsu

11
E se tivermos drawables tanto à esquerda quanto à direita e precisarmos apenas ajustar o drawable direito?
— nmxprime

Eu só uso: android: paddingLeft, e ele muda a posição da imagem. android: drawablePadding é usado para o espaço entre a imagem e o texto.
— Admirável

O problema desse código é que ele passwordToggleDrawableaumenta o espaço esquerdo do preenchimento, pois não pode ser direcionado apenas para o drawable esquerdo.
— Fruit

184

O TextView possui uma propriedade android: drawablePadding , que deve fazer o truque:

android: drawablePadding

O preenchimento entre as gavetas e o texto.

Deve ser um valor de dimensão, que é um número de ponto flutuante anexado a uma unidade como "14,5sp". As unidades disponíveis são: px (pixels), dp (pixels independentes da densidade), sp (pixels dimensionados com base no tamanho da fonte preferido), em (polegadas), mm (milímetros).

Isso também pode ser uma referência a um recurso (no formato "@ [package:] type: name") ou atributo de tema (no formato "? [Package:] [type:] name") contendo um valor desse tipo .

Isso corresponde ao símbolo do recurso de atributo global drawablePadding.


61

android:drawablePaddingsó criará um espaço de preenchimento entre o texto e o drawable se o botão for pequeno o suficiente para pressionar os 2 juntos. Se o botão for maior que a largura combinada (para drawableLeft / drawableRight) ou a altura (para drawableTop / drawableBottom), o drawablePadding não fará nada.

Também estou lutando com isso agora. Meus botões são bem amplos, e o ícone está pendurado na borda esquerda do botão e o texto está centralizado no meio. Minha única maneira de contornar isso por enquanto foi assar em uma margem no drawable adicionando pixels em branco à borda esquerda da tela com o photoshop. Não é o ideal e também não é realmente recomendado. Mas essa é a minha solução para o problema, por enquanto, antes da reconstrução do TextView / Button.


obrigado por explicar o meu problema. Eu não percebi que ele é causado apenas quando o botão é grande o suficiente
— peter.bartos

Eu tenho o mesmo problema. Meu botão é grande para que o drawable não é perto do texto
— Milad Faridnia

yay funcionou obrigado
— dave o grady

43

Sim. use drawablePadding da seguinte maneira,

<TextView
        android:id="@+id/tvHeader"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Settings and Contents"
        android:drawableLeft="@drawable/icon_success"
        android:drawablePadding="10dp" />

37

Crie seus recursos desenhados.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true">
        <inset android:drawable="@drawable/small_m" android:insetLeft="10dp" android:insetTop="10dp" />
    </item>
    <item>
        <inset android:drawable="@drawable/small_p" android:insetLeft="10dp" android:insetTop="10dp" />
    </item>
</selector>

2
@ The Finest Artist Eu uso inserível no drawable e está funcionando bem para dispositivos com versões mais recentes. Quero dizer, não está funcionando no SDK 16, 17, mas trabalhando no SDK 23. Existe alguma idéia?
— Bhavin Chauhan


Boa resposta e voto positivo para isso. Você acabou de me ajudar a resolver um problema que me confundiu por muito tempo.
— Anthonyeef 07/07

34

android:drawablePaddingé a maneira mais fácil de dar preenchimento ao ícone desenhável, mas Você não pode fornecer um preenchimento específico de um lado como paddingRightou paddingLeftdo ícone desenhável. E se você aplicar paddingLeftou, paddingRightem Edittextseguida, ele colocará o preenchimento como um todo, Edittextjuntamente com o ícone de desenho.


12

defina uma forma para o seu edittext e dê um preenchimento Por exemplo

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >
    <padding
        android:left="5dp"
        android:right="5dp"
    />
    <solid android:color="#F6F6F6" />
    <stroke
        android:width="1px"
        android:color="#C3C3C3" />

    <corners
        android:bottomLeftRadius="1dp"
        android:bottomRightRadius="1dp"
        android:topLeftRadius="1dp"
        android:topRightRadius="1dp" />
</shape>

O preenchimento definido nesta forma ajudará a dar preenchimento à esquerda de desenho ou à direita ---------------------- Aplique essa forma no EditView

 <EditText
            android:id="@+id/example"
            android:layout_width="fill_parent"
            android:layout_height="36dp"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:background="@drawable/shape2"
            android:drawableLeft="@drawable/icon1"
            android:drawablePadding="@dimen/txtDrwblPadding"
            android:ems="10"
         />

usar essa forma definida como plano de fundo dará ao EditText algum estilo e margem para drawableLeft.


12

android: drawablePadding é a maneira mais fácil de fornecer preenchimento ao ícone do drawable, mas você não pode fornecer um preenchimento de um lado específico, como paddingRight ou paddingLeft do ícone do drawable. E se você aplicar paddingLeft ou paddingRight ao Edittext, ele colocará o padding em todo o Text Edit junto com o ícone de desenho.

<TextView android:layout_width="match_parent"
    android:padding="5sp"
    android:id="@+id/date"
    android:gravity="center|start"
    android:drawableEnd="@drawable/ic_calendar"
    android:background="@drawable/edit_background"
    android:hint="Not Selected"
    android:drawablePadding="10sp"
    android:paddingStart="10sp"
    android:paddingEnd="10sp"
    android:textColor="@color/black"
    android:layout_height="wrap_content"/>

Você deveria estar usando "dp"
— Mark Pazon 16/01

11
<TextView
    android:layout_width="wrap_content"
    android:layout_height="32dp"
    android:background="@drawable/a"
    android:drawableLeft="@drawable/concern_black"
    android:gravity="center"
    android:paddingLeft="10dp"
    android:paddingRight="10dp"
    android:drawablePadding="10dp"
    android:text="text"/>

note: layout_width precisa ser wrap_content e use paddingLeft paddingRight drawablePadding para controlar o espaço. Se você especificar o valor layout_width is will tiver espaço entre o ícone e o texto, acho que, uma vez que o layout_width especifique o valor, o preenchimento será medido.


9

Vou jogar minha resposta no ringue também. Se você quiser fazer isso programaticamente, faça o seguinte.

final Drawable drawable = ContextCompat.getDrawable(getContext(), R.drawable.somedrawable);
final boolean isLTR = ViewCompat.LAYOUT_DIRECTION_LTR == ViewCompat.getLayoutDirection(this);
final int iconInsetPadding = getResources().getDimensionPixelSize(R.dimen.icon_padding);

final Drawable insetDrawable = new InsetDrawable(drawable, isLTR ? 0 : iconInsetPadding, 0, isLTR ? iconInsetPadding : 0, 0);

Isso adicionará o preenchimento ao final do drawable, onde end significará esquerda / direita, dependendo do telefone estar em LTR ou RTL.


7

Em vez de Buttonusar LinearLayoutcom ImageViewe TextViewdentro. Em itens filhos, como ImageViewe TextViewuso android:duplicateParentState="true".


Você realmente precisa de um FrameLayout e um botão (eo ImageView / TextView dentro de seu próprio LinearLayout) para reproduzir o botão UI e transferir o OnClickListener () para o botão parte
— 3c71

11
Por que usar layout adicional se você já possui drawablePadding no TextView.
— Parinda Rajapaksha

5

Você deve considerar o uso de lista de camadas

Crie um arquivo drawable como este, denomine ic_calendar.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape android:shape="rectangle">
        <solid android:color="@android:color/transparent"/>
    </shape>
</item>
<item android:right="10dp">
    <bitmap android:gravity="center_vertical|left"
        android:src="@drawable/ic_calendar_16dp"
        android:tint="@color/red"
        />
</item>
</layer-list>

Em arquivo de layout,

<TextView
         android:id="@+id/tvDate"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:drawableLeft="@drawable/ic_calendar"
         android:textColor="@color/colorGrey"
         android:textSize="14sp" 
    />

4

Você pode usar um preenchimento para o botão e jogar com drawablePadding

 <Button
    style="@style/botonesMenu"
    android:padding="15dp"
    android:drawablePadding="-15dp"
    android:text="@string/actualizarBD"
    android:textAlignment="gravity"
    android:gravity="center"
    android:layout_row="1"
    android:layout_column="0"
    android:drawableTop="@drawable/actualizar"
    android:id="@+id/btnActualizar"
    android:onClick="actualizarBD" />

você pode usar um preenchimento específico depende de onde colocar seu drawable, com android: paddingLeft = "10dp" ou android: paddingBottom = "10dp" ou android: paddingRight = "10dp" ou android: paddingTop = "10dp"


2

Você pode usar android:drawableLeft="@drawable/your_icon"para definir o drawable a ser mostrado no lado esquerdo. Para definir um preenchimento para o drawable, use android:paddingLeftou android:paddingRightpara definir o preenchimento esquerdo / direito, respectivamente.

android:paddingRight="10dp"
android:paddingLeft="20dp"
android:drawableRight="@drawable/ic_app_manager"

1

Se o tamanho do recurso extraível for fixo, você poderá fazer o seguinte:

<Button
    android:background="@drawable/rounded_button_green"
    style="?android:attr/selectableItemBackground"
    android:layout_height="wrap_content"
    app:layout_widthPercent="70%"
    android:drawableRight="@drawable/ic_clear_black_24dp"
    android:paddingRight="10dp"
    android:paddingLeft="34dp"
    tools:text="example" />

A chave aqui é que:

    android:drawableRight="@drawable/ic_clear_black_24dp"
    android:paddingRight="10dp"
    android:paddingLeft="34dp"

Ou seja, o tamanho do recurso extraível mais paddingRight é o paddingLeft.

Você pode ver o resultado neste exemplo


1
textView.setCompoundDrawablesWithIntrinsicBounds(AppCompatResources.getDrawable(this,drawable),null,null,null);

addressTitleView.setCompoundDrawablePadding();

Embora esse trecho de código possa resolver a questão, incluir uma explicação realmente ajuda a melhorar a qualidade da sua postagem. Lembre-se de que você está respondendo à pergunta dos leitores no futuro e essas pessoas podem não saber os motivos da sua sugestão de código.
— Rosário Pereira Fernandes

Isso só funciona para exibição de texto não eg botão que também permite definir de início drwables / finais
— Ixx

1

basta refazer de:

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

    <corners android:radius="40dp"/>

    <solid android:color="@android:color/white"/>

</shape>

para

<layer-list
        xmlns:android="http://schemas.android.com/apk/res/android">
    <item
            android:right="@dimen/_2dp"
            android:left="@dimen/_2dp"
            android:bottom="@dimen/_2dp"
            android:top="@dimen/_2dp"
            >
        <shape
                xmlns:android="http://schemas.android.com/apk/res/android">

            <corners android:radius="40dp"/>

            <solid android:color="@android:color/white"/>

        </shape>
    </item>

</layer-list>

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.