自定义我的按钮

Question

我有带有文本的按钮。我想要的是没有文字的同一个按钮，按钮中间有一个小图标。我假设该图标必须是您保存在可绘制文件中的图像，但是当我将其放入按钮中时，它会被设置为背景..

此外，所有带有图标的图像都是带有黑色图标的图像，并被空白包围以使其成为正方形。我想保留我的按钮，只是在它的中心有一个图标。 有谁知道如何做到这一点？

活动主代码：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.example.rodekruis.MainActivity">


    <LinearLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.example.rodekruis.MainActivity">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="20dp"
        android:src="@drawable/rkz_logo"
        android:layout_gravity="center" />


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_marginBottom="20dp"
        android:orientation="horizontal">

        <Button
            android:id="@+id/button10"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_alignTop="@+id/button8"
            android:layout_marginRight="5dp"
            android:layout_weight="1"
            android:text="  Afspraak   maken" />


        <Button
            android:id="@+id/button8"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="5dp"
            android:layout_marginRight="5dp"
            android:layout_weight="1"
            android:text="  Bezoek  tijden" />

        <Button
            android:id="@+id/button9"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="5dp"
            android:layout_weight="1"
            android:background="@drawable/contact"
            android:text="Contact" />

    </LinearLayout>


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="20dp"
        android:orientation="horizontal">


        <Button
            android:id="@+id/button3"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginRight="5dp"
            android:layout_weight="1"
            android:text=" Geef je mening!" />


        <Button
            android:id="@+id/button4"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="5dp"
            android:layout_marginRight="5dp"
            android:layout_weight="1"
            android:text=" Route begeleiding" />

        <Button
            android:id="@+id/button1"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_alignLeft="@+id/button5"
            android:layout_below="@+id/button8"
            android:layout_marginLeft="5dp"
            android:layout_weight="1"
            android:text="Specialisten" />

    </LinearLayout>


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_marginTop="10dp"
        android:orientation="horizontal">

        <Button
            android:id="@+id/button5"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginRight="5dp"
            android:layout_weight="1.03"
            android:text="Brandwonden centrum" />


        <Button
            android:id="@+id/button6"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="5dp"
            android:layout_marginRight="5dp"
            android:layout_weight="1"
            android:text="Agenda" />


        <Button
            android:id="@+id/button7"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="5dp"
            android:layout_weight="1"
            android:text="Nieuws" />
    </LinearLayout>

</LinearLayout>
</LinearLayout>

这是顶行按钮的代码：

 <LinearLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.example.rodekruis.MainActivity">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="20dp"
        android:src="@drawable/rkz_logo"
        android:layout_gravity="center" />


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_marginBottom="20dp"
        android:orientation="horizontal">

        <Button
            android:id="@+id/button10"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_alignTop="@+id/button8"
            android:layout_marginRight="5dp"
            android:layout_weight="1"
            android:text="  Afspraak   maken" />


        <Button
            android:id="@+id/button8"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="5dp"
            android:layout_marginRight="5dp"
            android:layout_weight="1"
            android:text="  Bezoek  tijden" />

        <ImageButton
            android:id="@+id/button9"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="5dp"
            android:layout_weight="1"
            android:src="@drawable/rkz_logo"
            android:gravity="center"
            android:text="Contact" />

    </LinearLayout>

Answer 1

使用ImageButton 小部件而不是Button 小部件。然后使用android:src标签设置图片，android:gravity="center"设置图片重心为中心。

希望它会有所帮助:)

更新 然后试试这个 -

 <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher"  //Your image icon
        android:background="@android:drawable/btn_default_small"/>

Answer 2

试试ImageButton。顾名思义，它是一个带有图像的按钮。要设置图像，请执行以下操作：

android:src。

希望这会有所帮助。

Answer 3

改变

<Button
            android:id="@+id/button9"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="5dp"
            android:layout_weight="1"
            android:background="@drawable/contact"
            android:text="Contact" />

到

<ImageButton
            android:id="@+id/button9"
            style="?android:attr/buttonStyleSmall"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="5dp"
            android:layout_weight="1"
            android:src="@drawable/contact"
            android:text="Contact" />

如果你不想方形按钮编辑

<ImageButton
                android:id="@+id/button9"
                style="?android:attr/buttonStyleSmall"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_marginLeft="5dp"
                android:background="@android:color/transparent"
                android:layout_weight="1"
                android:src="@drawable/contact"
                android:text="Contact" />