目录

  • 1.按钮图标
    • 1.1获取按钮图标文件
    • 1.2 按钮图标API说明:
    • 1.3 按钮图标基本例程
  • 2.按钮样式文件
    • 2.1 new_button_style.xml
    • 2.2 color.xml
    • 2.3 按钮样式API说明:
    • 2.4 按钮样式基本例程
  • 完整修改例程
  • 总结

欢迎关注 『安卓』 系列,持续更新中
欢迎关注 『安卓』 系列,持续更新中
【1.修改按钮样式之圆角按钮+按钮图标(保姆级图文+附示例+api例程)】
【2.修改app名、图标、主题风格(保姆级图文+附示例+api例程)】
【3.修改列表增加下划线样式(保姆级图文+附示例)】
【4.修改SeekBar样式进度条样式(保姆级图文+附示例)】
【5.关于音乐播放器的按钮动态效果修改】
【更多内容敬请期待】

美化按钮样式分为两步

  • 按钮图标
    可以在阿里图标库寻找合适的按钮图片下载使用
  • 按钮形状
    圆角按钮需要使用自定义的xml样式模板

1.按钮图标

1.1获取按钮图标文件

你可以自己找自己喜欢的图标,不一定用我的。
介绍下载方法的博客 https://blog.csdn.net/u011027547/article/details/122379520

这里我给出我用的几个按钮来自 https://www.iconfont.cn/collections/detail?spm=a313x.7781069.0.da5a778a4&cid=10812
辛苦的给你打包好了,直接下载 https://download.csdn.net/download/u011027547/74908220

  1. next.png
  2. play.png
  3. previous.png
  4. stop.png
  5. clear_cancel.png

下载得到的图标文件放在main/res/drawable文件下

1.2 按钮图标API说明:

app:srcCompat=“参数”
app:srcCompat="@drawable/previous"

  • 参数:填写按钮自定义的图标图片名,不需要加上.png等文件后缀

1.3 按钮图标基本例程

这里以改动一个img_prev按钮为例子

基础版原来的代码:

<ImageButtonandroid:id="@+id/img_prev"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginLeft="10dp"android:layout_marginRight="10dp"android:layout_weight="1"android:background="@drawable/new_button_style"app:srcCompat="@android:drawable/ic_media_previous" />

修改后的代码

 <ImageButtonandroid:id="@+id/img_prev"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginLeft="10dp"android:layout_marginRight="10dp"android:layout_weight="1"android:background="@drawable/new_button_style"app:srcCompat="@drawable/previous" />

2.按钮样式文件

也可以访问另一个博客观看 https://blog.csdn.net/u011027547/article/details/122382014

2.1 new_button_style.xml

在main/res/drawable文件夹下新建new_button_style.xml样式文件


<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"><!--1、圆角 和 按下后背景变颜色--><item android:state_pressed="false"><!-- 按钮未点击--><shape><stroke android:width="3dp" android:color="@color/Purple" /><!-- 边框颜色,边框大小--><solid android:color="@color/touming" /> <!-- 填充的颜色:这里设置背景透明 --><corners android:radius="50dp" /><!-- android:radius 弧形的半径 --><padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" /></shape></item><item android:state_pressed="true"> <!-- 按钮选中状态--><shape><stroke android:width="3dp" android:color="@color/red" /><!-- 边框颜色,边框大小--><solid android:color="@color/green" /> <!-- 填充的颜色:这里设置背景透明 --><corners android:radius="50dp" /><!-- android:radius 弧形的半径 --><padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" /></shape></item>
</selector>

2.2 color.xml

颜色文件values/color.html

<?xml version="1.0" encoding="utf-8"?>
<resources><color name="purple_200">#FFBB86FC</color><color name="purple_500">#FF6200EE</color><color name="purple_700">#FF3700B3</color><color name="teal_200">#FF03DAC5</color><color name="teal_700">#FF018786</color><color name="black">#FF000000</color><color name="white">#FFFFFFFF</color><color name="orange">#FFC107</color><color name="yellow">#f5d14b</color><color name="red">#e66eb8</color><color name="green">#6bd669</color><color name="blue">#3d68ce</color><color name="Purple">#7e55fc</color><color name="touming">#11512124</color></resources>


2.3 按钮样式API说明:

android:background=“参数”
android:background="@drawable/new_button_style"

  • 参数:填写按钮自定义的样式名

2.4 按钮样式基本例程

这里以改动一个img_prev按钮为例子

基础版原来的代码:

<ImageButtonandroid:id="@+id/img_prev"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginLeft="10dp"android:layout_marginRight="10dp"android:layout_weight="1"android:background="@android:color/holo_blue_light"app:srcCompat="@android:drawable/ic_media_previous" />

修改后代码示例

            <ImageButtonandroid:id="@+id/img_prev"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginLeft="10dp"android:layout_marginRight="10dp"android:layout_weight="1"android:background="@drawable/new_button_style"app:srcCompat="@drawable/previous" />

修改后的效果,出现了圆角图标


完整修改例程

<LinearLayoutandroid:layout_width="match_parent"android:layout_height="0dp"android:layout_weight="1.5"android:orientation="horizontal"><LinearLayoutandroid:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:gravity="center"android:orientation="horizontal"><ImageButtonandroid:id="@+id/img_prev"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginLeft="10dp"android:layout_marginRight="10dp"android:layout_weight="1"android:background="@drawable/new_button_style"app:srcCompat="@drawable/previous" /></LinearLayout><LinearLayoutandroid:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:gravity="center"android:orientation="horizontal"><ImageButtonandroid:id="@+id/img_play"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginLeft="10dp"android:layout_marginRight="10dp"android:layout_weight="1"android:background="@drawable/new_button_style"app:srcCompat="@drawable/play" /></LinearLayout><LinearLayoutandroid:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:gravity="center"android:orientation="horizontal"><ImageButtonandroid:id="@+id/img_stop"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginLeft="10dp"android:layout_marginRight="10dp"android:layout_weight="1"android:background="@drawable/new_button_style"app:srcCompat="@drawable/clear_cancel"/></LinearLayout><LinearLayoutandroid:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:gravity="center"android:orientation="horizontal"><ImageButtonandroid:id="@+id/img_next"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginLeft="10dp"android:layout_marginRight="10dp"android:layout_weight="1"android:background="@drawable/new_button_style"app:srcCompat="@drawable/next" /></LinearLayout></LinearLayout>

总结

大家喜欢的话,给个

【安卓】1.修改按钮样式之圆角按钮+按钮图标(保姆级图文+附示例+api例程)相关推荐

  1. android倒角按钮,Android实现圆角Button按钮

    本文实例讲述了Android开发圆角Button按钮实现过程,分享给大家供大家参考,具体内容如下 需求及效果图: 实现思路: 1.shape实现圆角 在drawable新建两个xml 文件, 这两个 ...

  2. android 实现圆角按钮,Android实现圆角Button按钮

    本文实例讲述了Android开发圆角Button按钮实现过程,分享给大家供大家参考,具体内容如下 需求及效果图: 实现思路: 1.shape实现圆角 在drawable新建两个xml 文件, 这两个 ...

  3. 安卓ClickableSpan修改超链接样式

    近期在做安卓富文本的时候,遇到了一个问题就是ClickableSpan用在文本上时,是有超链接样式的(蓝色字体.下划线),那么如何修改默认样式呢,话不多说上代码 int color = Color.R ...

  4. html5 按钮css样式修改,css样式制作的漂亮按钮

    复制代码代码如下: Demo: CSS3 Buttons body { background: #ededed; width: 900px; margin: 30px auto; color: #99 ...

  5. HTML按钮样式,CSS精美按钮

    1.效果图如下: 2.HTML代码 <body><br/><br/><br/><div style="margin:100px 100p ...

  6. 修改git bash字体样式(保姆级图文)

    步骤 系列文章 前言 1.随便打开一个git bash 2.打开option 3.点击text 4.修改字体大小 看看效果 总结 系列文章 提示:转到日常小技巧专栏,观看更多内容! 点我直达–> ...

  7. 虚拟机上网与linux kali2018和windows虚拟机ip地址修改的方法(保姆级图文)

    步骤 系列文章 前言 1.实验准备 1.1linux系统虚拟机(这里以kali 2018为例) 1.2windows系统虚拟机(2003server为例) 1.3做好备份 2.修改linux系统的虚拟 ...

  8. 忘记mysql密码后如何修改密码(2022最新版详细教程保姆级)

    忘记mysql密码后如何修改密码 注意事项 步骤 注意事项 一共用到两个cmd窗口,每一个都要以管理员身份打开,且在修改密码后,要先关闭第一个跳过验证密码的mysql服务的cmd窗口,再启动mysql ...

  9. 关于如何修改Intel QC7笔记本BIOS启动LOGO的保姆级教程

    教你如何修改Intel QC7笔记本的BIOS LOGO(开机画面) 注意:本篇教程只针对于Intel QC7模具笔记本(攀升迁跃者d.未来人类QC7.爱尔轩幻影Q.MAG-15等一众LAPQC71电 ...

最新文章

  1. 谁扛起张一鸣的游戏野心?
  2. php分享表单提交到本页的实例
  3. NUC1312 Sum【水题+数学题】
  4. 80后,天才程序员, Facebook 第一任 CTO,看看开挂的人生到底有多变态?
  5. 媒体声音 | 阿里云王伟民:阿里云数据库的策略与思考
  6. 【poj1742】 Coins
  7. Java多线程之迭代器问题(四)
  8. 3.10 神经网络的梯度下降法-推导
  9. python里面Dataset干嘛的_用 Python 对成绩分类汇总!
  10. 【个人学习记录】RoboWare Studio安装使用
  11. HTML5开发实战之网易微博
  12. matlab 模拟水滴,Keyshot tips :使用 Keyshot 程序贴图模拟水滴效果
  13. Android ToolBar修改返回按钮图标
  14. linux运维工程师工作职责
  15. Cyh和香穗子(NDK1352)
  16. MySQL索引分析扩展理解
  17. android zip解压简书,iOS解压ZIP压缩包
  18. IllegalArgumentException: XML fragments parsed from previous mappers already contains value for *
  19. 微信公众号如何做好日常维护?
  20. 【论文笔记】:Libra R-CNN: Towards Balanced Learning for Object Detection

热门文章

  1. Maya API编程教学for TD:MEL加密技术
  2. export default 和 export之间的区别
  3. 环材化生劝退文章汇总 2019.3
  4. 路由器刷openwrt琐碎记录
  5. 脸上长有黑痣(痦子)祛除
  6. 怎么在编辑器上将CAD转换成PDF格式后保存桌面?
  7. 【首页】vue、element-ui首页界面框架
  8. 推荐 :浅谈用户全生命周期管理
  9. GPU与CPU的性能比较及影响因素
  10. 谷歌发布2015年度搜索排行榜