Wie entferne ich das Auffüllen von Schaltflächen in Android?

183

In meiner Android-App habe ich folgendes Layout:

<?xml version="1.0" encoding="utf-8" ?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:orientation="vertical">

    <fragment
         android:id="@+id/map"
         android:layout_width="match_parent"
         android:layout_height="0dp" 
         android:layout_weight="1" 
         class="com.google.android.gms.maps.SupportMapFragment"/>

    <Button
        android:id="@+id/button_back"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:onClick="CloseActivity"
        android:padding="0dp"
        android:text="@+string/back" />

</LinearLayout>

In der Vorschau und auf dem Telefon sieht es so aus:

Wie Sie auf der Schaltfläche im unteren Bereich sehen können, gibt es dort einige Polster.

Wie kann ich das loswerden und die Schaltfläche den unteren Bereich vollständig ausfüllen lassen?

Omega
quelle
6
Die Antwort von DATerre ist seit zwei Jahren richtig. Kannst du es so markieren?
Johnny Lambada
1
Diese Frage muss bearbeitet werden, um einen besseren Titel zu erhalten. Es ist das erste Ergebnis in der Google-Suche, obwohl es die Frage nicht wirklich beantwortet.
SOFe

Antworten:

431

Für mich stellte sich heraus, dass das Problem bei einigen Android-Themen minHeight und minWidth war.

Fügen Sie im Button-Element Folgendes hinzu:

<Button android:minHeight="0dp" android:minWidth="0dp" ...

Oder im Stil Ihrer Schaltfläche:

<item name="android:minHeight">0dp</item>
<item name="android:minWidth">0dp</item>
DA Terre
quelle
5
Es dauerte eine Weile, bis mir klar wurde, dass ich es nicht mit einem seltsamen Polsterverhalten zu tun habe, sondern mit minHeight.
Pijusn
7
Ich glaube nicht, dass diese Antwort die ursprüngliche Frage überhaupt beantwortet. Aber ich bin immer noch froh, dass ich darauf gestoßen bin, weil ich nicht herausfinden konnte, warum mein ButtonGerät auch nach dem Einstellen noch so viel Platz beansprucht android:background="@null". Die Tatsache, dass der ButtonStandardstil des Benutzers verantwortlich ist, ist ein sehr guter Tipp.
Tony Chan
Es ist wichtig, sowohl Android: minHeight = "0dp" als auch Android: minWidth = "0dp" zu verwenden, und nicht nur eines davon.
Ricardo
Dadurch werden die abgerundeten Ecken und der Welleneffekt von der Schaltfläche auf Android Nougat entfernt. Gibt es eine Idee, was dieses Verhalten verursachen könnte?
rraallvv
Diese Antwort löste ein Problem mit einem GridLayout, das Schaltflächen mit AutoSize-Optionen für den Text enthielt, der wahnsinnig wurde, als ich versuchte, mehr Schaltflächen in Zeilen / Spalten einzufügen. Einfache Antwort, die ich lange
gebraucht habe
71

Meine Lösung wurde für die Eigenschaften insetTop und insetBottom auf 0 gesetzt.

<android.support.design.button.MaterialButton
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:insetTop="0dp"
        android:insetBottom="0dp"
        android:text="@string/view_video"
        android:textColor="@color/white"/>
Sochas
quelle
1
Dies hat das Problem auch für mich gelöst! Vielen Dank!
SPM
46

Das ist kein Auffüllen, sondern der Schatten um die Schaltfläche im Hintergrund, der gezeichnet werden kann. Erstellen Sie Ihren eigenen Hintergrund und es wird verschwinden.

Delyan
quelle
6
Ich tat. ist nicht verschwunden.
Hasan
Wie kann seine Größe gemessen werden?
Iman Akbari
Dies ist es, @Behr, den Hintergrund auf die Farbe der Schaltfläche ändern
Ramon
Ich habe gerade festgestellt, dass mein Hintergrundbild eine transparente Polsterung hat
Obst
22

Eine Problemumgehung kann darin bestehen, -veWerte für Ränder wie die folgenden zu verwenden:

<Button
    android:id="@+id/button_back"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:onClick="CloseActivity"
    android:padding="0dp"
    android:layout_marginLeft="-5dip"
    android:layout_marginRight="-5dip"
    android:layout_marginTop="-5dip"
    android:layout_marginBottom="-5dip"
    android:text="@string/back" />

Es wird diesen Raum verschwinden lassen. Ich meine, Sie können den geeigneten dipWert auswählen , wodurch er verschwindet. Es hat bei mir funktioniert. Hoffe es funktioniert bei dir.

Shobhit Puri
quelle
4
Ich würde mit dieser Lösung vorsichtig sein. Es wird lediglich der Hintergrund der Schaltfläche (Rand + Schatten) mit negativen Rändern ausgeblendet. Was sind Stiländerungen und Rand + Schatten benötigt mehr als 5 dp? Ich würde lieber die Delyan / Casey Murray-Lösung verwenden, um auf der sicheren Seite zu sein.
Lenrok258
Außerdem werden negative Ränder in Android nicht offiziell unterstützt, daher würde auch ich dies vermeiden
Tim Kist
13

Zum Entfernen der Polsterung um die Umschalttaste müssen minWidth und minHeight 0dp eingestellt werden.android:minWidth="0dp" android:minHeight="0dp"

  <ToggleButton
        android:id="@+id/toggle_row_notifications"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:minWidth="0dp"
        android:minHeight="0dp"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:padding="@dimen/_5sdp"
        android:textOn=""
        android:textOff=""
        android:background="@android:color/transparent"
        android:button="@drawable/toggle_selector"
        />

Setzen Sie Ihre zeichnbare Datei auf ein Schaltflächenattribut wie: android:button="@drawable/toggle_selector"

Unten ist meine toggle_selecter.xmlDatei

<?xml version="1.0" encoding="utf-8"?>
     <selector xmlns:android="http://schemas.android.com/apk/res/android">
            <item android:drawable="@drawable/notifications_toggle_on" 
                  android:state_checked="true"/>
            <item android:drawable="@drawable/notifications_toggle_off" 
                  android:state_checked="false"/>
     </selector>
Yashoda Bane
quelle
9

Ich bin neu in Android, aber ich hatte eine ähnliche Situation. Ich habe getan, was @Delyan vorgeschlagen hat, und auch android verwendet: background = "@ null" in der XML-Layoutdatei.

Casey Murray
quelle
6

Im XML-Set der Schaltfläche android:includeFontPadding="false"

user1005462
quelle
6

Ich hatte das gleiche Problem und es scheint, dass es an der Hintergrundfarbe der Schaltfläche liegt. Versuchen Sie, die Hintergrundfarbe in eine andere Farbe zu ändern, z.

android:background="@color/colorActive"

und sehen, ob es funktioniert. Sie können dann einen Stil definieren, wenn die Schaltfläche verwendet werden soll.

Panagiotis
quelle
Dadurch wird die Hervorhebungs- / Animationsfunktion der Schaltfläche entfernt.
Altus
4

Es ist keine Polsterung, sondern der Schatten des Hintergrunds oder ein Problem mit dem minHeightund minWidth.

Wenn Sie immer noch den schönen Welleneffekt wünschen, können Sie Ihren eigenen Schaltflächenstil erstellen, indem Sie ?attr/selectableItemBackground:

<style name="Widget.AppTheme.MyCustomButton" parent="Widget.AppCompat.Button.Borderless">
    <item name="android:minHeight">0dp</item>
    <item name="android:minWidth">0dp</item>
    <item name="android:layout_height">48dp</item>
    <item name="android:background">?attr/selectableItemBackground</item>
</style>

Und wende es auf die Schaltfläche an:

<Button 
    style="@style/Widget.AppTheme.MyCustomButton"
    ... />
Allan Veloso
quelle
2

Es scheint nicht Polsterung, Rand oder Mindesthöhe / -breite zu sein. Das Einstellen android:background="@null"der Schaltfläche verliert ihre Touch-Animation, aber es stellt sich heraus, dass das Einstellen des Hintergrunds auf irgendetwas diesen Rand behebt.


Ich arbeite derzeit mit:

minSdkVersion 19
targetSdkVersion 23
juil
quelle
2

Entfernen der oberen und unteren Polsterung

<com.google.android.material.button.MaterialButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:minHeight="0dp"//to effect the following parameters, this must be added!
        android:insetTop="0dp"
        android:insetBottom="0dp"/>

Entfernen der linken und rechten Polsterung

<com.google.android.material.button.MaterialButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:minWidth="0dp"//to effect the following parameters, this must be added!
        android:insetLeft="0dp"
        android:insetRight="0dp"/>
Ali Rezaiyan
quelle
1

Geben Sie Ihrer Schaltfläche einen benutzerdefinierten Hintergrund: @ drawable / material_btn_blue

Mike6679
quelle
0

Sie können dies auch mit layout_width(height)Parametern tun .

ZB habe ich den oberen und unteren Bereich mit android:layout_height="18dp"Code gelöscht .

Max Zonov
quelle
0

Ein Standardknopf sollte nicht in voller Breite verwendet werden , weshalb dies auftritt.

Hintergrund

Wenn Sie sich das Materialdesign - Schaltflächenstil ansehen, werden Sie feststellen, dass eine Schaltfläche einen Klickbereich von 48 dp Höhe hat, aber aus irgendeinem Grund als 36 dp Höhe angezeigt wird.

Dies ist der Hintergrundumriss, den Sie sehen und der nicht den gesamten Bereich der Schaltfläche selbst abdeckt.
Es hat abgerundete Ecken und einige Polsterungen und soll von selbst anklickbar sein, seinen Inhalt einwickeln und nicht die gesamte Breite am unteren Bildschirmrand überspannen.

Lösung

Wie oben erwähnt, möchten Sie einen anderen Hintergrund . Keine Standardschaltfläche, sondern ein Hintergrund für ein auswählbares Element mit diesem schönen Welleneffekt.

Für diesen Anwendungsfall gibt es das ?selectableItemBackgroundThemenattribut, das Sie für Ihre Hintergründe verwenden können (insbesondere in Listen).
Es wird eine Plattform-Standardwelligkeit (oder eine Farbstatusliste auf <21) hinzugefügt und Ihre aktuellen Themenfarben verwendet.

Für Ihren Anwendungsfall können Sie einfach Folgendes verwenden:

<Button
    android:id="@+id/sign_in_button"
    style="?android:attr/buttonBarButtonStyle"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="Login"
    android:background="?attr/selectableItemBackground" />
                   <!--  /\ that's all -->

Es ist auch nicht erforderlich, Layoutgewichte hinzuzufügen, wenn Ihre Ansicht die einzige ist und sich über den gesamten Bildschirm erstreckt

Wenn Sie eine andere Vorstellung davon haben, wie Ihr Hintergrund aussehen soll, müssen Sie selbst ein benutzerdefiniertes Zeichen erstellen und dort Farbe und Status verwalten.

Diese Antwort wurde aus Frage kopiert : Wie entferne ich Polster (oder Ränder?) Um Schaltflächen in Android richtig?

Mohammad7G
quelle
0

Nach Stunden der mehrere Antworten zu graben um , fand ich endlich eine Lösung , die kein anderes Element nicht verwendet, manipulieren minHeightoder minWidthoder sogar Umwickeln Buttonum einen RelativeLayout.

<Button
    android:foreground="?attr/selectableItemBackground"
    android:background="@color/whatever" />

Der wichtigste Aspekt hierbei ist die Einstellung des Vordergrunds anstelle des Hintergrunds, wie in vielen Antworten festgelegt. selectableItemBackgroundWenn Sie den Hintergrund selbst ändern , werden alle Änderungen, die Sie an der Farbe / dem Hintergrund der Schaltfläche vorgenommen haben, überschrieben, sofern vorhanden.

Wenn Sie den Vordergrund ändern, erhalten Sie das Beste aus beiden Welten: Entfernen Sie die "unsichtbare" Polsterung und behalten Sie das Design Ihrer Schaltfläche bei.

Altus
quelle
0

Sie können mit Borderless Stil in AppCompatButton wie unten. und benutze Android: Hintergrund damit.

style = "@ style / Widget.AppCompat.Button.Borderless.Colored"

Schaltflächencode

<androidx.appcompat.widget.AppCompatButton
        android:id="@+id/button_visa_next"
        android:background="@color/colorPrimary"
        style="@style/Widget.AppCompat.Button.Borderless.Colored"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/spacing_normal"
        android:text="@string/next"
        android:textColor="@color/white"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

Ausgabe:

Geben Sie hier die Bildbeschreibung ein

Shihab Uddin
quelle