[英]Create Button with rounded corners in android
I'm trying to create a button which looks as in the image above. 我正在尝试创建一个看起来如上图所示的按钮。 Initially my idea was to create a 9 patch and set it as the button background. 最初我的想法是创建一个9补丁并将其设置为按钮背景。 But since, this is a plain button, i think we can somehow draw this without using any images. 但是,因为这是一个简单的按钮,我想我们可以在不使用任何图像的情况下以某种方式绘制它。
The button background color is #0c0c0c The border color is #1a1a1a The text color is #cccccc 按钮背景颜色为#0c0c0c边框颜色为#1a1a1a文本颜色为#cccccc
I found a similar question on SO but that creates a gradient - 我在SO上发现了一个类似的问题,但这会产生一个渐变 -
Android - border for button Android - 按钮边框
The Android Developer's Guide has a detailed guide on this: Shape Drawbables . Android开发人员指南有一个详细的指南: Shape Drawbables 。
You could also simply remove the gradient
element from the link you provided: 您也可以从您提供的链接中删除gradient
元素:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="3dp" />
<stroke android:width="5px" android:color="#1a1a1a" />
</shape>
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@+id/textView1"
android:layout_alignLeft="@+id/textView1"
android:layout_marginBottom="56dp"
android:text="Button"
android:textColor="#FF0F13"
android:background="@drawable/bbkg"/>//create bbkg.xml in drawable folder
bbkg.xml//button background bbkg.xml //按钮背景
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="@drawable/pressed" />
<item android:state_focused="false"
android:drawable="@drawable/normal" />
</selector>
normal.xml //button background normal state normal.xml //按钮背景正常状态
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#10EB0A"/>
<stroke android:width="3dp"
android:color="#0FECFF" />
<padding android:left="5dp"
android:top="5dp"
android:right="5dp"
android:bottom="5dp"/>
<corners android:bottomRightRadius="7dp"
android:bottomLeftRadius="7dp"
android:topLeftRadius="7dp"
android:topRightRadius="7dp"/>
</shape>
pressed.xml //button background pressed state pressed.xml //按钮后台按下状态
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#FF1A47"/>
<stroke android:width="3dp"
android:color="#0FECFF"/>
<corners android:bottomRightRadius="7dp"
android:bottomLeftRadius="7dp"
android:topLeftRadius="7dp"
android:topRightRadius="7dp"/>
</shape>
If you want something like this 如果你想要这样的东西
Button preview 按钮预览
here is the code. 这是代码。
1.Create a xml file in your drawable folder like mybutton.xml and paste the following markup: 1.在mybutton.xml中的可绘制文件夹中创建一个xml文件并粘贴以下标记:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_pressed="true" >
<shape android:shape="rectangle" >
<corners android:radius="3dip" />
<stroke android:width="1dip" android:color="#5e7974" />
<gradient android:angle="-90" android:startColor="#345953" android:endColor="#689a92" />
</shape>
</item>
<item android:state_focused="true">
<shape android:shape="rectangle" >
<corners android:radius="3dip" />
<stroke android:width="1dip" android:color="#5e7974" />
<solid android:color="#58857e"/>
</shape>
</item>
<item >
<shape android:shape="rectangle" >
<corners android:radius="3dip" />
<stroke android:width="1dip" android:color="#5e7974" />
<gradient android:angle="-90" android:startColor="#8dbab3" android:endColor="#58857e" />
</shape>
</item>
</selector>
2.Now use this drawable for the background of your view. 2.现在使用此drawable作为视图的背景。 If the view is button then something like this: 如果视图是按钮,那么这样的事情:
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
android:textColor="#ffffff"
android:background="@drawable/mybutton"
android:text="Buttons" />
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.