android自定义圆角实线边框,圆角虚线边框,直实线,虚实线,半圆角边框

本文介绍了如何在Android中创建自定义边框,包括圆角实线边框、圆角虚线边框、直实线、虚实线以及半圆角边框。通过修改shape属性和stroke属性,可以轻松设置边框的宽度、颜色以及虚线样式。此外,文章还提及了使用<view/>元素设置直线的方法。
先上图。
<img src="https://img-my.csdn.net/uploads/201510/05/1444048517_3752.png-thumb.jpg" width="1080" height="1920" style="font-family: Arial, Helvetica, sans-serif;" alt="" />
<span style="font-family: Arial, Helvetica, sans-serif;">在现实项目开发中,单纯的Button,EditText等控件远远不能满足我们项目的UI设计需求,这时候,我们就需要自己动手丰衣足食啦。接下来先给大家介绍一些属性,备注写的都非常清楚啦,我就不啰嗦啦。</span>
<?xml version="1.0" encoding="utf-8"?>
<!--android:shape属性代表绘制的图形形状 retangle;矩形,oval:椭圆 ,line:线 ring,环形-->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="###">

    <!--stroke主要给我们所要画的图形进行描边 color:边框颜色,width:边框宽度,dashGap:虚线框的间隔,dashWidth:虚线框的宽度-->
    <stroke
        android:width="###"
        android:color="###"
        android:dashGap="###"
        android:dashWidth="###" />

    <!--corners主要是设置我们所画图形四个角的半径 radius:四角半径 bottomLeftRadius:左下角半径,
    bottomRightRadius:右下角半径,topLeftRadius:左上角半径,topRightRadius:右上角半径-->
    <corners
        android:bottomLeftRadius="###"
        android:bottomRightRadius="###"
        android:radius="###"
        android:topLeftRadius="###"
        android:topRightRadius="###" />

    <!--padding主要设置内边距,也就是你装载的内容(大部分是Textview或者button)离图形边框的距离
    bottom:下内边距,left:左内边距,right:右内边距,top:上内边距-->
    <padding
        android:bottom="###"
        android:left="###"
        android:right="###"
        android:top="###" />

    <!--这个就不需要讲了吧-->
    <size
        android:width="###"
        android:height="###" />
    <!--主要设置你所画图形的填充色-->
    <solid
        android:color="###"/>
    <!--gradient主要指定一个渐变颜色的形状。-->
    <gradient
        android:angle="###"
        android:centerColor="###"
        android:centerX="###"
        android:centerY="###"
        android:gradientRadius="###"
        android:endColor="###"
        android:startColor="###"
        android:type="###"
        android:useLevel="###"/>
</shape>

接下来我们看最顶上的"哈哈"与"嘻嘻"。通过corners设置左下角和左上角的半径为5dp,右上角,右下角半径为0dp,我们就可以得到左边圆角,右边直角的边框啦。
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item>
        <shape android:shape="rectangle">
            <stroke
                android:width="1.2dp"
                android:color="#6f4189" />

            <solid android:color="#6f4189" />
            <corners
                android:bottomLeftRadius="5dp"
                android:bottomRightRadius="0dp"
                android:topLeftRadius="5dp"
                android:topRightRadius="0dp" />

            <padding
                android:bottom="2dp"
                android:left="12dp"
                android:right="12dp"
                android:top="2dp" />
        </shape>
    </item>

</layer-list>
下面一样,通过corners设置右下角和右上角的半径为5dp,左上角,左下角半径为0dp,我们即可得到左边直角,右边圆角的边框。
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

    <item>
        <shape>
            <stroke
                android:width="1.2dp"
                android:color="#6f4189" />
            <corners
                android:bottomLeftRadius="0dp"
                android:bottomRightRadius="5dp"
                android:topLeftRadius="0dp"
                android:topRightRadius="5dp" />
            <solid android:color="#00000000" />
            <padding
                android:bottom="2dp"
                android:left="12dp"
                android:right="12dp"
                android:top="2dp" />
        </shape>
    </item>

</layer-list>

它俩再加上viewpager就可以实现很多App上都有的左右滑动翻页效果啦。

我们再看图中的用户名和密码输入框,至于整个框框就不说啦,和上面的'嘻嘻','哈哈'一个原理,主要给大家介绍一下中间的红线。实现很简单,我们只需要设置android:shape="line",然后通过stoke的android:width设置直线的宽度,android;color设置直线的颜色即可。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="line">
   <stroke
       android:width="1.2dp"
       android:color="#ff4323"/>
</shape>

让其在页面的显示代码如下

<LinearLayout
            android:id="@+id/straight_line"
            android:layout_width="fill_parent"
            android:layout_height="2dp"
            android:background="@drawable/line"
            android:orientation="vertical"></LinearLayout>

其实设置直线还有种跟直观的方法,通过<view/>来设置,在这里就不细讲,大家可以自行百度。


接下来我们看看下面的三个登录框框,重点给大家讲讲最后面那个"断点"虚线框框。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners
        android:radius="5dp"/>
    <solid
        android:color="#E67e22"/>
</shape>
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners
        android:radius="5dp"/>
    <stroke
        android:color="#E67e22"
        android:width="1.0dp"/>
</shape>

其中color是定义虚线的颜色,dashGap定义的是虚线的间隔,width定义的是虚线的大小,dashWidth定义虚线的宽度。</span>

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners
        android:radius="5dp"/>
    <stroke
        android:color="#E67e22"
        android:width="1.0dp"/>
</shape>





                
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值