Android Button修改背景颜色及实现科技感效果

目录

效果展示

实现科技感效果

修改Button背景

结语


效果展示

Android Button修改背景颜色及实现科技感效果效果如下:

实现科技感效果

操作方法如下:

想要创建一个富有科技感的按钮样式时,可以使用 Android 的 Shape Drawable 和 Selector。

先在drawable中建立一个新的but_1.xml文件

在文件中将以下代码粘贴到其中

javascript 复制代码
<?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">
            <solid android:color="#FF3366"/>
            <corners android:radius="10dp"/>
        </shape>
    </item>

    <item>
        <shape android:shape="rectangle">
            <gradient
                android:startColor="#FF6699"
                android:endColor="#FF3366"
                android:angle="270"/>
            <corners android:radius="10dp"/>
        </shape>
    </item>
</selector>

在上述示例中,我们使用了 selector 标签来定义不同状态下的按钮样式。首先,在按下按钮时(android:state_pressed="true"),我们使用一个矩形的 ShapeDrawable,设置填充颜色为 #FF3366,并且添加了圆角效果。

然后,对于按钮的默认状态,我们使用了一个矩形的 ShapeDrawable,设置了渐变背景颜色(从 #FF6699#FF3366),并且同样添加了圆角效果。

你可以根据需要调整颜色、圆角大小和其他属性,以满足您对科技感按钮样式的要求。

修改Button背景

我们可以发现在布局xml文件中直接修改background是没有作用的,会变成默认的主题色(themes.xml中的colorPrimary颜色,默认为紫色)

javascript 复制代码
<Button
        android:id="@+id/btn_login"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="wrap_content"
        android:textSize="18sp"
        android:layout_gravity="center"
        android:text="Login"
        android:background="@drawable/but_1"
            android:textAllCaps="false"
            />

这是由于在Android4.1之后的开发中创建的Button是Material类型的,默认使用主题色的,所以我们需要替换主题色或者使用非Material类型的Button,修改如下:

javascript 复制代码
<android.widget.Button
        android:id="@+id/btn_login"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="wrap_content"
        android:textSize="18sp"
        android:layout_gravity="center"
        android:text="Login"
        android:background="@drawable/but_1"
            android:textAllCaps="false"
            />

将Button修改为android.widget.Button标签即可。

结语

今日分享结束,关注抖音账号"小光在努力了",每天分享有趣的代码。

🌌点击下方个人名片,交流会更方便哦~(欢迎到博主主页加入我们的 CodeCrafters联盟一起交流学习 ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓

相关推荐
军训猫猫头2 小时前
20.抽卡只有金,带保底(WPF) C#
ui·c#·wpf
希忘auto2 小时前
详解Redis的常用命令
redis·1024程序员节
wuningw3 小时前
ant-design-ui的Select选择器多选时同时获取label与vaule值
ui·arcgis
SoraLuna8 小时前
「Mac畅玩鸿蒙与硬件47」UI互动应用篇24 - 虚拟音乐控制台
开发语言·macos·ui·华为·harmonyos
拭心10 小时前
Google 提供的 Android 端上大模型组件:MediaPipe LLM 介绍
android
带电的小王12 小时前
WhisperKit: Android 端测试 Whisper -- Android手机(Qualcomm GPU)部署音频大模型
android·智能手机·whisper·qualcomm
梦想平凡13 小时前
PHP 微信棋牌开发全解析:高级教程
android·数据库·oracle
元争栈道13 小时前
webview和H5来实现的android短视频(短剧)音视频播放依赖控件
android·音视频
阿甘知识库14 小时前
宝塔面板跨服务器数据同步教程:双机备份零停机
android·运维·服务器·备份·同步·宝塔面板·建站
元争栈道14 小时前
webview+H5来实现的android短视频(短剧)音视频播放依赖控件资源
android·音视频