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联盟一起交流学习 ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓

相关推荐
2501_915918411 天前
掌握 iOS 26 App 运行状况,多工具协作下的监控策略
android·ios·小程序·https·uni-app·iphone·webview
知识分享小能手1 天前
uni-app 入门学习教程,从入门到精通,uni-app基础扩展 —— 详细知识点与案例(3)
vue.js·学习·ui·微信小程序·小程序·uni-app·编程
2501_915909061 天前
iOS 混淆实战,多工具组合完成 IPA 混淆与加固(源码 + 成品 + 运维一体化方案)
android·运维·ios·小程序·uni-app·iphone·webview
Larry_Yanan1 天前
QML学习笔记(四十二)QML的MessageDialog
c++·笔记·qt·学习·ui
*才华有限公司*1 天前
安卓前后端连接教程
android
氦客1 天前
Android Compose中的附带效应
android·compose·effect·jetpack·composable·附带效应·side effect
Javashop_jjj1 天前
三勾软件| 用SpringBoot+Element-UI+UniApp+Redis+MySQL打造的点餐连锁系统
spring boot·ui·uni-app
雨白1 天前
Kotlin 协程的灵魂:结构化并发详解
android·kotlin
我命由我123451 天前
Android 开发问题:getLeft、getRight、getTop、getBottom 方法返回的值都为 0
android·java·java-ee·android studio·android jetpack·android-studio·android runtime