android: drawable Lewy margines i / lub dopełnienie

Odpowiedzi:

464

Jak wspomniano android:drawablePaddingcephus wymusi wypełnienie między tekstem a rysunkiem tylko wtedy, gdy przycisk jest wystarczająco mały.

Podczas układania większych przycisków można używać android:drawablePaddingw połączeniu z android:paddingLefti, android:paddingRightaby wymusić tekst i możliwość rysowania do wewnątrz w kierunku środka przycisku. Dostosowując osobno lewą i prawą wyściółkę, możesz bardzo szczegółowo dostosować układ.

Oto przykładowy przycisk, który używa dopełnienia, aby zbliżyć tekst i ikonę bliżej siebie niż byłoby to domyślnie:

<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" />  
Jordania
źródło
21
android: paddingLeft = "30dip" android: paddingRight = "26dip" są tutaj kluczowe!
IgorGanapolsky
4
nie ma to związku z pytaniem, ale android: gravity = "center" utrzyma tekst wyrównany do środka rysunku!
cwhsu
1
Co się stanie, jeśli będziemy mieli drawable zarówno po lewej, jak i po prawej stronie, i będziemy musieli tylko dopasować prawo do rysowania?
nmxprime
Używam tylko: android: paddingLeft, i to zmienia pozycję obrazu. android: drawablePadding służy do odstępu między obrazem a tekstem.
Brave
Problemem tego kodu jest to, że powoduje, że passwordToggleDrawablelewa przerwa na wypełnianie staje się większa, ponieważ nie jest w stanie określić docelowego tylko lewego rysowania.
Fruit
184

TextView ma android: drawablePadding mienia, które powinno załatwić sprawę:

Android: drawablePadding

Wypełnienie między rysunkami a tekstem.

Musi to być wartość wymiaru, która jest liczbą zmiennoprzecinkową dołączoną do jednostki, takiej jak „14,5 sp”. Dostępne jednostki to: px (piksele), dp (piksele niezależne od gęstości), sp (piksele skalowane na podstawie preferowanego rozmiaru czcionki), cale (cale), mm (milimetry).

Może to być również odniesienie do zasobu (w postaci „@ [pakiet:] typ: nazwa”) lub atrybutu motywu (w postaci „? [Pakiet:] [typ:] nazwa”) zawierającego wartość tego typu .

Odpowiada to symbolowi globalnego zasobu atrybutu drawablePadding.

Cheryl Simon
źródło
61

android:drawablePaddingutworzy odstęp wypełniania między tekstem a rysunkiem, tylko jeśli przycisk jest wystarczająco mały, aby ściśnąć 2 razem. Jeśli przycisk jest szerszy niż łączna szerokość (dla drawableLeft / drawableRight) lub wysokość (dla drawableTop / drawableBottom), wówczas drawablePadding nic nie robi.

Ja też mam z tym problem. Moje przyciski są dość szerokie, a ikona wisi na lewej krawędzi przycisku, a tekst jest wyśrodkowany na środku. Moim jedynym sposobem obejścia tego problemu jest upieczenie marginesu na rysunku, dodając puste piksele do lewej krawędzi płótna w Photoshopie. Nie jest to idealne i też nie jest zalecane. Ale to na razie moje rozwiązanie stop-gap, bez odbudowywania TextView / Button.

cephus
źródło
dzięki za wyjaśnienie mojego problemu. Nie zdawałem sobie sprawy, że jest to spowodowane tylko wtedy, gdy przycisk jest wystarczająco szeroki
peter.bartos
Mam ten sam problem. Mój przycisk jest szeroki, więc rysunek nie jest zbliżony do tekstu
Milad Faridnia
tak, zadziałało dzięki
dave o grady
43

Tak. użyj drawablePadding w następujący sposób,

<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" />
Parinda Rajapaksha
źródło
37

Stwórz swój drawable resources.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>
Najlepszy artysta
źródło
2
@ Najlepszy artysta Używam wstawki w rysowalnych i działa dobrze na nowszych wersjach urządzeń. Mam na myśli, że nie działa w SDK 16, 17, ale działa w SDK 23. Czy jest jakiś pomysł?
Bhavin Chauhan
Ładna odpowiedź i głosowanie za tym. Pomagasz mi rozwiązać problem, który długo mnie mylił.
Anthonyeef
34

android:drawablePaddingjest najłatwiejszym sposobem nadania wypełnienia ikonie do rysowania, ale nie można podać określonej wypełnienia z jednej strony, takiej jak paddingRightlub paddingLeftikony do rysowania. Aby to osiągnąć, musisz w nią zagłębić. A jeśli złożysz podanie paddingLeftlub paddingRightdo Edittextniego, to Edittextwstawi wypełnienie do całości wraz z ikoną do rysowania.

Bhargav Thanki
źródło
12

zdefiniuj kształt dla swojego tekstu edycyjnego i nadaj mu dopełnienie Na przykład

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

Dopełnienie zdefiniowane w tym kształcie pomoże w dopełnieniu do przeciągnięcia w lewo lub w prawo ---------------------- Zastosuj ten kształt w 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"
         />

użycie tego zdefiniowanego kształtu jako tła da Twojemu EditText trochę stylu plus margines do drawableLeft.

Umesh N.
źródło
12

android: drawable Padding to najprostszy sposób nadania wypełnienia ikonie do rysowania, ale nie można podać określonego wypełnienia z jednej strony, takiego jak paddingRight lub paddingLeft z drawable icon.Aby to osiągnąć, musisz się w to zagłębić. A jeśli zastosujesz paddingLeft lub paddingRight do Edittext, wówczas wstawi padding do całego Edittext wraz z ikoną do rysowania.

<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"/>
Sekhon123
źródło
Powinieneś używać „dp”
Mark Pazon
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"/>

Uwaga: szerokość_szablonu musi być zawijana_zawartość i używać paddingLeft paddingRight drawablePadding, aby kontrolować odstęp. Jeśli określisz wartość layout_width, wartość będzie miała odstęp między ikoną a tekstem, myślę, że gdy nadasz parametrowi layout_width określoną wartość, dopełnienie będzie mierzyć.

王良海
źródło
9

Wrzucę też moją odpowiedź na ring. Jeśli chcesz to zrobić programowo, możesz wykonać następujące czynności.

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

Spowoduje to dodanie dopełnienia na końcu rysunku, gdzie koniec będzie oznaczał lewo / prawo, w zależności od tego, czy telefon jest w trybie LTR czy RTL.

Daniel Ochoa
źródło
7

Zamiast Buttonstosowania LinearLayoutz ImageVieworaz TextViewwewnątrz. W elementach podrzędnych takich jak ImageViewi TextViewużywaj android:duplicateParentState="true".

Aleksiej Zacharow
źródło
Będziesz potrzebować FrameLayout i Button (oraz ImageView / TextView wewnątrz ich własnego LinearLayout) do odtworzenia interfejsu użytkownika Button i przeniesienia onclicklistenerener () do części z przyciskami
3c71
1
Po co używać dodatkowego układu, jeśli masz już rysunkowyPadding w TextView.
Parinda Rajapaksha
5

Powinieneś rozważyć użycie listy warstw

Utwórz plik do rysowania, taki jak ten, nazwij go 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>

W pliku układu

<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" 
    />
RayChongJH
źródło
4

Możesz użyć padding dla przycisku i możesz grać z padablePadding

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

możesz użyć konkretnego paddingu w zależności od tego, gdzie umieścisz swój drawable, z Androidem: paddingLeft = "10dp" lub androidem: paddingBottom = "10dp" lub androidem: paddingRight = "10dp" lub androidem: paddingTop = "10dp"

Karolina
źródło
2

Możesz użyć, android:drawableLeft="@drawable/your_icon"aby ustawić rysunek, który będzie wyświetlany po lewej stronie. Aby ustawić padding dla drawable, należy użyć android:paddingLeftlub, android:paddingRightaby ustawić odpowiednio lewe / prawe padding.

android:paddingRight="10dp"
android:paddingLeft="20dp"
android:drawableRight="@drawable/ic_app_manager"
Aouled Isssa
źródło
1

Jeśli rozmiar zasobu do rysowania jest stały, możesz to zrobić w następujący sposób:

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

Kluczem jest tutaj:

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

Oznacza to, że rozmiar zasobu do rysowania plus paddingRight to paddingLeft.

Możesz zobaczyć wynik w tym przykładzie

użytkownik3344964
źródło
1
textView.setCompoundDrawablesWithIntrinsicBounds(AppCompatResources.getDrawable(this,drawable),null,null,null);

addressTitleView.setCompoundDrawablePadding();
Srinivas Kokkula
źródło
Ten fragment kodu może rozwiązać pytanie, ale wyjaśnienie naprawdę pomaga poprawić jakość posta. Pamiętaj, że w przyszłości odpowiadasz na pytanie czytelników, a ci ludzie mogą nie znać przyczyn Twojej sugestii kodu.
Rosário Pereira Fernandes
Działa to tylko w przypadku widoku tekstu, a nie np. Przycisku, który pozwala również ustawić drwable początkowe / końcowe
Ixx,
1

po prostu przerób z:

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

do

<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>
Nicolas Asinovich
źródło
-6

Próbuje użyć ujemnego wypełnienia

Lubić:

android:paddingLeft="-8dp"
Philipe Steiff
źródło