Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >具有类似Google play按钮的边框背景的按钮

具有类似Google play按钮的边框背景的按钮
EN

Stack Overflow用户
提问于 2017-07-11 06:29:49
回答 4查看 160关注 0票数 0

我想在我的应用程序中添加这个按钮:

我可以创建可绘制与框架。但是我不知道,如何在按钮上添加这个背景。如果我设置了android:background属性,那么按钮将失去材质设计效果。

我该怎么做呢?

EN

回答 4

Stack Overflow用户

回答已采纳

发布于 2017-07-11 07:18:34

代码语言:javascript
运行
AI代码解释
复制
Try This,

Create Drawable

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

Apply on Button in your layout
         <Button
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:background="@drawable/button_back"
         android:textColor="#05BC32"
         android:textSize="18sp"
         android:text="OPEN"/>
票数 0
EN

Stack Overflow用户

发布于 2017-07-11 06:56:56

试试这个,

首先创建一个可绘制的具有框架的框架

代码语言:javascript
运行
AI代码解释
复制
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <solid android:color="@android:color/white" />
    <stroke
        android:width="2dp"
        android:color="@color/colorAccent" />

</shape>

在这之后创建你的涟漪效果,可为drawable-v21 (版本>=棒棒糖)绘制:

代码语言:javascript
运行
AI代码解释
复制
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="@color/your_ripple_color">

    <!-- button background -->
    <item android:drawable="@drawable/abc"/>
</ripple>

别忘了在pre-lollipop设备的drawable文件夹中添加选择器或同名的drawable

票数 0
EN

Stack Overflow用户

发布于 2017-07-11 07:19:37

首先在colors.xml文件中声明绿色

代码语言:javascript
运行
AI代码解释
复制
 <?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="green">#3cb879</color>
    <color name="white">#ffffff</color>
</resources>

然后创建一个名为green_button.xml的可绘制文件,并复制以下代码

代码语言:javascript
运行
AI代码解释
复制
        <?xml version="1.0" encoding="UTF-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape>
            <solid android:color="#e78181" />
            <stroke android:width="5dip" android:color="@color/green" />
            <corners android:radius="10dip" />
            <padding android:left="0dp" android:top="0dp" android:right="0dp" android:bottom="0dp" />
        </shape>
    </item>
    <item>
        <shape>
            <gradient android:startColor="#ffffff" android:endColor="#ffffff" android:angle="270" />
            <stroke android:width="1dp" android:color="#ffffff" />
            <corners android:radius="4dp" />
            <padding android:left="0dp" android:top="0dp" android:right="0dp" android:bottom="0dp" />
        </shape>
    </item>
</selector>

然后在activity_main.xml中创建按钮,然后像这样给它应用背景。

代码语言:javascript
运行
AI代码解释
复制
<Button
        android:layout_width="150dp"
        android:layout_height="60dp"
        android:text="OPEN"
        android:textColor="@color/green"
        android:textSize="30sp"
        android:layout_margin="5dp"
        android:background="@drawable/green_button"/>

see output here

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/45026940

复制
相关文章
Android自定义按钮状态背景
如果你觉得Android自带的按钮默认、按下时样式太low,可以尝试自定义按钮状态背景:
张拭心 shixinzhang
2022/11/30
8210
为wordpress添加google+按钮
作者:matrix 被围观: 1,093 次 发布时间:2013-09-10 分类:Wordpress 兼容并蓄 | 无评论 »
HHTjim 部落格
2022/09/26
5450
为wordpress添加google+按钮
unity 背景根据按钮数量变化
立羽
2023/08/24
1570
unity 背景根据按钮数量变化
【CSS】CSS 背景设置 ⑧ ( 背景设置案例 | 导航栏按钮 )
在 div 盒子中的 a 标签是 行内元素 , 为其设置宽高是无效的 , 首先要将其转为 行内块样式 ;
韩曙亮
2023/03/30
4.6K0
【CSS】CSS 背景设置 ⑧ ( 背景设置案例 | 导航栏按钮 )
【HTML】HTML 表单 ② ( 按钮表单 | 普通按钮 | 提交按钮 | 重置按钮 | 图片按钮 | 文件域 )
将 <input /> 标签 的 type 属性设置为 button , 就可以将该 表单组件 设置为 普通按钮 类型表单 ;
韩曙亮
2023/03/30
8.5K0
【HTML】HTML 表单 ② ( 按钮表单 | 普通按钮 | 提交按钮 | 重置按钮 | 图片按钮 | 文件域 )
给 WordPress 博客添加 Google Buzz 按钮
Google Buzz 是 Google 推出的整合在 Gmail 中分享个人状态信息和其他动态的工具,只要是 Gmail 用户,就可以在 Buzz 中通过空开或者私密的方式来分享文字,图片,视频等信息,在移动设备中,还可以通过 Buzz 向好友分享地理位置,并且 Google Buzz 还可以直接导入个人的 Twitter,Picasa,Google Reader,博客等各种内容。 由于 Google Buzz 整合到 Gmail 中,所以这个服务一开始,就有非常多的用户,那么如何让博客读者把你的博客中的日志分享到 Google Buzz 中,让你的博客日志在更多的用户分享和传播呢?今天我就讲解下如何添加 Google Buzz 按钮到 WordPress 博客当中。
Denis
2023/04/14
9220
给 WordPress 博客添加 Google Buzz 按钮
一个类似抖音 APP 拍摄按钮效果的控件
效果图预览 用法 <net.angrycode.library.TouchButton android:id="@+id/touch_btn" android:layo
阳仔
2019/07/31
8480
一个类似抖音 APP 拍摄按钮效果的控件
跟我学Rx编程——调皮的背景音乐按钮
有些H5的页面会有一个按钮控制背景音乐播放,如果只是单一页面的话,没有什么逻辑可言。但如果涉及到转场,那么逻辑就复杂起来。
我不是码神
2022/07/28
5360
Android开发 点击按钮切换背景的两种方法
第一种方式 第二种方式 获取ListView某个Item中的控件
用户2192970
2019/02/21
2.7K0
Android开发 点击按钮切换背景的两种方法
CSS好看的按钮
好看的按钮 <style> .btn { BORDER-RIGHT: #7b9ebd 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7b9ebd 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#cecfde); BO
欢醉
2018/01/22
2.3K0
利用GDI+制作背景颜色淡入淡出效果的按钮
用过QQ2009的网友都知道QQ主面板的界面非常炫丽,特别好看,鼠标移上去还有淡入淡出的效果。那这样效果是怎么做出来的呢?其实不难,只要自定义一个用户控件的外怪就可以了,用到GDI+技术和时钟控件来操作…
SAP梦心
2022/05/09
1.1K0
巧用layer-list实现按钮背景阴影、投影
我们在实现UI标注画图的时候难免会遇到要求按钮带阴影的效果。很多人会想,现在安卓5.0以上原生控件已经支持android:elevation=""属性设置投影了,再者也可以使用CardView给需要投影的布局控件来包一层,因为CardView也是带app:cardElevation=""属性的,设置投影还不是分分钟的事。 当我在实际开发中时,项目需求几乎所有的控件按钮都是带阴影的,列表项、详情项等等,如果使用切图肯定是不大现实的,占用空间太大。当我使用上面提到的android:elevation=""与ap
木溪bo
2019/07/28
2.5K0
自定义UITabBar--实现类似新浪微博中间的发送按钮
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u010105969/article/details/52710240
用户1451823
2018/09/13
6510
Xamarin.Forms 按钮样式 圆角按钮
在 Xamarin 中可以方便进行样式定义或不进行定义样式只修改属性而改变外观,如按钮的圆角可以通过 CornerRadius 属性设置
林德熙
2020/12/07
3.3K0
freemarker文件下,bootstrap 点击按钮,切换按钮上的图标
fa标签在bootstrap封装的原形是:使用一个单<i>并增加对应的CSS类名,例: <i class="fa fa-search"></i>
全栈程序员站长
2022/06/30
3.7K0
点击按钮背景变灰色,松开恢复原来色
最初的时候我是想用js逻辑去修改样式,如果点击了,那么就改为灰色,松开后,再改为白色。结果demo有100多个列表项,我也不可能加上100多个监听,我突然想起以前学的事件代理,然后就实践了一把。出现了如下代码
砖业洋__
2023/05/06
5220
点击加载更多

相似问题

具有透明背景的按钮渐变边框

35

具有可绘制边框和背景的按钮

120

Swift中具有透明背景的按钮边框

45

设置已具有背景色的按钮边框

23

具有透明背景和旋转渐变边框的按钮

17
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档