[英]Button with left icon and text perfectly aligned
晚上好,
我正在开发一个Android的app,目前在XML做登录界面。
我正在尝试创建带有图标和文本的按钮,如下图所示:
http://i.imgur.com/J5Cj1w4.png
这是我的实际结果:
http://i.imgur.com/VPALdDD.png
使用此代码:
<Button
style="?android:textAppearanceSmall"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/sign_up_facebook"
android:text="@string/signup_with_facebook"
android:textColor="@color/primaryTextLight"
android:drawableLeft="@drawable/ic_facebook_box_white_24dp"
android:layout_weight="0"
android:background="@drawable/button_shape_login"/>
<Button
style="?android:textAppearanceSmall"
android:layout_marginTop="20sp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/sign_up_google"
android:text="@string/signup_with_google"
android:textColor="@color/primaryTextLight"
android:drawableLeft="@drawable/ic_google_plus_box_white_24dp"
android:layout_weight="0"
android:background="@drawable/button_shape_login"/>
我被困在这一步。
如何使用 XML 代码获得最终需要的结果?
谢谢!
你可以给这样的padding填充: android:drawablePadding="50dip"
使用android:drawablePadding属性
更好的选择是实际使按钮成为内部布局设置的相对/线性布局,drawablePadding将不能很好地使用不同长度的文本和按钮。
本质上,RelativeLayout是你的按钮,带有嵌套的ImageView和TextView,你可以很好地控制布局,在按钮内的图像和文本周围有一致的填充。
我没有测试过以下内容,这基本上就是你需要的
<LinearLayout
android:id="@+id/facebookButton"
android:layout_width="250dp"
android:layout_height="80dp"
android:orientation="horizontal">
<ImageView
android:src="@drawable/your_drawable"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_gravity="center_vertical"
android:layout_marginLeft="50dp"/>
<TextView
android:text="Sign up with Facebook"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="25dp"/>
</LinearLayout>
您只需要指定android:paddingLeft
属性。
例如,尝试指定值36dp
android:gravity="center_vertical"
//在textView中使用
<Button
android:paddingLeft="50dp"
android:textAlignment="textStart"
android:drawableLeft="@drawable/"
/>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.