安卓使用.9图实现阴影效果box-shadow: 0 2px 6px 1px rgba(0,0,0,0.08);

news2024/12/23 7:53:45

1.安卓实现阴影效果有很多种,一般UX设计会给以H5参数box-shadow: 0 2px 6px 1px rgba(0,0,0,0.08);这种方式提供背景阴影效果,这里记录一下实现过程

2.界面xml源码

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android">

    <data>

        <import type="android.text.TextUtils" />

        <variable
            name="appCardEntity"
            type="cn.com.westone.cxjr.cxsdk.model.AppCardEntity" />

        <variable
            name="adapter"
            type="cn.com.westone.cx.platform.fragment.sub.card.AppCardListDataType.AppCardListDataTypeAdapter" />


    </data>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/app_card_shadow_bg" //带阴影边框的透明背景图
        android:minHeight="144dp"
        android:orientation="vertical"
        android:paddingHorizontal="16dp"
        android:paddingVertical="8dp">

        <LinearLayout
            android:id="@+id/ll_title"
            android:layout_width="match_parent"
            android:layout_height="32dp"
            android:gravity="center_vertical"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/iv_icon"
                android:layout_width="16dp"
                android:layout_height="16dp"
                android:padding="2dp"
                android:src="@drawable/ic_placeholder" />

            <com.westone.cx.commonsdk.uikit.scaleView.CXScaleTextView
                android:id="@+id/tv_title"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:ellipsize="end"
                android:gravity="center_horizontal"
                android:maxWidth="200dp"
                android:maxLines="1"
                android:text="@{TextUtils.isEmpty(appCardEntity.cardTitle)?appCardEntity.appName:appCardEntity.cardTitle}"
                android:textColor="@color/cx_first_level_text_color"
                android:textSize="@dimen/store_font_12" />

            <ImageView
                android:layout_width="16dp"
                android:layout_height="16dp"
                android:background="@drawable/arrow_right_icon"
                android:padding="2dp" />
        </LinearLayout>

        <cn.com.westone.cx.platform.fragment.sub.component.NonScrollListView
            android:id="@+id/lv_data"
            adapter="@{adapter}"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:divider="#00000000" />
    </LinearLayout>
</layout>

2.浅色模式和深色模式分别使用不同的rgba值做阴影颜色

PS:奉送一个大神提供的在线制作.9图的工具

Android Shadow Generator

2.1深色模式 app_card_shadow.9.png阴影参数 box-shadow: 0 2px 6px 1px rgba(26,26,26,0.29);

工具类参数:x:0  y:2  blur:6  round:8  rgba(26,26,26,0.29);

2.2浅色模式 app_card_shadow.9.png阴影参数 box-shadow: 0 2px 6px 1px rgba(250,250,250,0.29);

工具类参数:x:0  y:2  blur:6  round:8 rgba(250,250,250,0.29);

3.实现效果图

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2204066.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

小北的技术博客:探索华为昇腾CANN训练营与AI技术创新——Ascend C算子开发能力认证考试(中级)

前言 哈喽哈喽,这里是zyll~,北浊.(大家可以亲切的呼唤我叫小北)智慧龙阁的创始人,一个在大数据和全站领域不断深耕的技术创作者。今天,我想和大家分享一些关于华为昇腾CANN训练营以及AI技术创新的最新资讯和实践经验~(初级证书还没拿到的小伙伴,可以先参考小北的这篇技术…

QTableView-mode中嵌入复选框CheckBox

QTableView中嵌入复选框CheckBox 第二种方法&#xff1a;设置QAbstractTableModel的flags()函数法 通过Delegate创建QCheckBox来实现的Check列&#xff0c;只有在该列进入编辑模式时才能够Check/Uncheck。这显然不是我们想要的&#xff0c;网上翻来翻去&#xff0c;在一个国外论…

SpringBoot+Vue智能社区服务小程序

SpringBootVue智能社区服务小程序 SpringBootVue智能社区服务小程序 项目描述 智能社区服务小程序的前台小程序是一个集成多功能的综合性平台&#xff0c;旨在提供便捷、高效的社区服务。以下是关于各个功能的简单介绍&#xff1a; 用户管理&#xff1a;用户管理模块负责社区…

基于SpringBoot+Vue的非物质文化遗产保护与传播系统设计实现【原创】(地图组件)

&#x1f388;系统亮点&#xff1a;地图组件&#xff1b; 一.系统开发工具与环境搭建 1.系统设计开发工具 后端使用Java编程语言的Spring boot框架 项目架构&#xff1a;B/S架构 运行环境&#xff1a;win10/win11、jdk17 前端&#xff1a; 技术&#xff1a;框架Vue.js&#x…

Mysql(五) --- 数据库设计

文章目录 前言1.范式1.1.第一范式1.1.1 定义1.1.2.例子 1.2.第二范式1.2.1 定义1.2.2 例子1.2.3.不满足第二范式可能会出现的问题 1.3.第三范式1.3.1 定义2.3.2 示例 2. 设计过程3. 实体-关系图3.1 E-R图的基本组成3.2 关系的类型3.2.1 一对一关系(1:1)3.2.2 ⼀对多关系(1:N)3.…

Mac 需要杀毒软件?

大部分 mac用户普遍认为 Apple mac 不受病毒和恶意软件的影响。这导致许多 Mac 用户误以为无需为 Mac 安装防病毒软件&#xff0c;但事实并非如此。 在这篇文章中&#xff0c;将深入探讨 Mac 安全性的细节&#xff0c;探索针对 Apple 设备的恶意软件类型&#xff0c;并为您…

高质量SCI论文撰写及投稿丨论文选题、文献调研、实验设计、数据分析、论文结构及语言规范等----AI强大功能

科学研究的核心在于将复杂的思想和实验成果通过严谨的写作有效地传递给学术界和工业界。对于研究生、青年学者及科研人员&#xff0c;如何高效撰写和发表SCI论文&#xff0c;成为提升学术水平和科研成果的重要环节。系统掌握从选题到投稿的全过程&#xff0c;提高论文撰写效率与…

petalinux 自动登陆 自动启动程序

PetaLinux 自动登陆 (1) cd 到项目工程目录下&#xff1b; (2) 运行命令&#xff1a;petalinux-config -c rootfs (3) 依次选择 Image Features -> serial-autologin-root 保存退出 创建APP petalinux-create apps --template install --name init-app --enable编辑文件 …

【环境搭建】MAC M1安装ElasticSearch

STEP1 官网下载ES Download Elasticsearch | Elastic&#xff0c;下载mac m1对应版本的es STEP2 进入bin文件夹&#xff0c;执行./elasticSearch 浏览器输入 127.0.0.1:9200 STEP 3 下载对应Kibana版本&#xff0c;Download Kibana Free | Get Started Now | Elastic 出现报错…

微信点赞的测试用例,应该在哪些方面进行设计!

功能模块测试的测试用例设计方法包括&#xff1a; 等价类划分法&#xff1a;把所有可能的输入数据&#xff0c;即程序的输入域划分成若干部分&#xff0c;然后从每一个部分中选取少数具有代表性的数据作为测试用例。比如字符串长度检查,字符类型检查,标点符号检查,特殊字符检查…

使用 Docker 部署前端项目:Vue 和 React 结合 Nginx 实现静态文件托管

使用 Docker 部署前端项目&#xff1a;Vue 和 React 结合 Nginx 实现静态文件托管 Web 开发中&#xff0c;将前端项目&#xff08;例如 Vue 或 React 应用&#xff09;打包后通过 Docker 容器和 Nginx 部署是非常常见的方式。它不仅简化了部署流程&#xff0c;还能确保在不同环…

linux线程 | 线程的概念

前言:本篇讲述linux里面线程的相关概念。 线程在我们的教材中的定义通常是这样的——线程是进程的一个执行分支。 线程的执行粒度&#xff0c; 要比进程要细。 我们在读完这句话后其实并不能很好的理解什么是线程。 所以&#xff0c; 本节内容博主将会带友友们理解什么是线程&a…

Vulnhub靶场案例渗透[6]- DC6

文章目录 1. 靶场搭建2. 信息收集2.1 确定靶机ip2.2 主机信息收集2.3 主机目录扫描2.4 网站用户名和密码爆破 3. 反弹shell4. 提权 1. 靶场搭建 靶场源地址 检验下载文件的检验码&#xff0c;对比没问题使用vmware打开 # windwos 命令 Get-FileHash <filePath> -Algori…

RTSP 音视频play同步分析

基础理论 RTSP RTP RTCP SDP基础知识-CSDN博客 关于RTP的时间戳知识点回顾 时间戳单位&#xff1a;时间戳计算的单位不是秒&#xff0c;而是采用采样频率的倒数&#xff0c;这样做的目的是为了使时间戳单位更为精准。比如说一个音频的采样频率为8000Hz&#xff0c;那么我们可…

【华为】基于华为交换机的VLAN配置与不同VLAN间通信实现

划分VLAN&#xff08;虚拟局域网&#xff09;主要作用&#xff1a; 一、提高网络安全性 广播域隔离访问控制增强 二、优化网络性能 减少网络拥塞提高网络可管理性 sysytem-view #进入系统视图配置参数 vlan batch 10 20 #批量创建vlan LSW3: int g0/0/1 port…

「实战应用」如何用图表控件LightningChart可视化天气数据?(一)

LightningChart.NET完全由GPU加速&#xff0c;并且性能经过优化&#xff0c;可用于实时显示海量数据-超过10亿个数据点。 LightningChart包括广泛的2D&#xff0c;高级3D&#xff0c;Polar&#xff0c;Smith&#xff0c;3D饼/甜甜圈&#xff0c;地理地图和GIS图表以及适用于科学…

scau:面向对象java实验作业1-2 猜数字游戏

题目名称实验1-2 猜数字游戏题目关键字数据类型 基本输入输出 控制语句 方法题目录入时间2022/10/10 11:01:37题目内容 使用Java程序&#xff0c;项目名称&#xff1a;GuessNumberGame&#xff0c;类根据自己需要定义。 程序开始运行后&#xff0c;允许玩家进行多次猜数字的游…

C++从入门到起飞之——(multi)set与(multi)map的的使用 全方位剖析!

&#x1f308;个人主页&#xff1a;秋风起&#xff0c;再归来~&#x1f525;系列专栏&#xff1a;C从入门到起飞 &#x1f516;克心守己&#xff0c;律己则安 目录 1. 序列式容器和关联式容器 2. set系列的使⽤ 2.1 set和multiset参考⽂档 2.2 set类的介绍 2.3 se…

Effective C++笔记之二十四:stack overflow

溢出&#xff08;Stack Overflow&#xff09;是指程序运行过程中&#xff0c;栈空间被耗尽&#xff0c;导致无法继续分配栈内存的错误。C程序中&#xff0c;栈用于存储函数调用的局部变量、返回地址、函数参数等。当栈空间耗尽时&#xff0c;会引发栈溢出&#xff0c;通常导致程…

java的Maven项目的ehcache缓存学习记录

java的ehcache缓存学习记录 第1步:pom.xml增加ehcache的依赖项 <!--ehcache缓存--><dependency><groupId>net.sf.ehcache</groupId</