用shape做搜索样式【原创】

栏目: IOS · Android · 发布时间: 7年前

内容简介:以往用shape做这种圆弧时四个角的弧度都是一样的,但是想实现上图所示效果,恐怕难以实现。实际上上图所示效果是用两个shape拼起来的,但是只要边距大小吻合就能是两个shpe合二为一实现下面的效果,下面是上面效果具体实现的代码。xml代码:

最近项目中碰到这样一个搜索框的样式,如下图:

用shape做搜索样式【原创】

    以往用shape做这种圆弧时四个角的弧度都是一样的,但是想实现上图所示效果,恐怕难以实现。实际上上图所示效果是用两个shape拼起来的,但是只要边距大小吻合就能是两个shpe合二为一实现下面的效果,下面是上面效果具体实现的代码。

xml代码:

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="30dp"
    android:layout_gravity="center_horizontal"
    android:orientation="horizontal">

    <EditText
        android:id="@+id/et_search"
        android:layout_width="160dp"
        android:layout_height="30dp"
        android:maxLines="1"
        android:layout_gravity="center_horizontal"
        android:background="@drawable/search_left_shape"
        android:drawableLeft="@drawable/all_icon_search"
        android:drawablePadding="15dp"
        android:hint="Enter Community "
        android:gravity="center"
        android:paddingLeft="15dp"
        android:textColor="#333333"
        android:textSize="12sp" />

    <TextView
        android:id="@+id/tv_search"
        android:layout_width="60dp"
        android:layout_height="30dp"
        android:background="@drawable/search_right_shape"
        android:gravity="center_vertical"
        android:textColor="#fff"
        android:paddingLeft="5dp"
        android:text="Search" />
</LinearLayout>

下面是shape里面的代码(另外一个shape换成<item android:left=”-20dp”>):

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:right="-20dp">

<shape>
    <corners android:radius="25dp"></corners>
    <solid android:color="#fff"></solid>
    <stroke android:color="#ffb22d" android:width="1dp"/>
</shape>
</item>
</layer-list>

是不是实现起来很简单啊,shape的灵活运用在实际的项目中是必不可少的,网上也有许多关于shape的用法,只有多学多用才能更好的掌握这方面的知识。

转载时请注明出处及相应链接,本文永久地址:https://blog.yayuanzi.com/24467.html

用shape做搜索样式【原创】

用shape做搜索样式【原创】 微信打赏

用shape做搜索样式【原创】 支付宝打赏

感谢您对作者sunshine的打赏,我们会更加努力!    如果您想成为作者,请点我


以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

这就是OKR

这就是OKR

【美】约翰·杜尔(John Doerr) / 曹仰锋、王永贵 / 中信出版社 / 2018-12 / 68.00元

这本书是传奇风险投资人约翰·杜尔的作品,揭示了OKR这一目标设定系统如何促使英特尔、谷歌等科技巨头实现爆炸性增长,以及怎样促进所有组织的蓬勃发展。 20世纪70年代,在英特尔担任工程师时,杜尔首次接触到OKR。之后,作为一个风险投资人,杜尔不遗余力地将这一管理智慧,分享给50多家公司和机构,包括谷歌、亚马逊、领英、脸书、比尔及梅琳达·盖茨基金会,甚至摇滚歌手波诺的公益项目。在杜尔的帮助下,任......一起来看看 《这就是OKR》 这本书的介绍吧!

随机密码生成器
随机密码生成器

多种字符组合密码

XML、JSON 在线转换
XML、JSON 在线转换

在线XML、JSON转换工具

XML 在线格式化
XML 在线格式化

在线 XML 格式化压缩工具