Android企业级实战-界面篇-3

简介: 本文是《Android企业级实战-界面篇》系列的第三篇,主要介绍分割线和条形跳转框的实现方法,二者常用于设置和个人中心界面。文章通过具体代码示例展示了如何实现这两种UI组件,并提供了效果图。实现前需准备`dimens.xml`、`ids.xml`、`colors.xml`等文件,部分资源可参考系列第一、二篇文章。代码中详细说明了布局文件的配置,如分割线的样式定义和条形跳转框的组件组合,帮助开发者快速上手并应用于实际项目中。

文章目录

Android企业级实战-界面篇-3

计蒙创作不易,未入驻的其他平台搬运请按协议规则搬运。

前言

发表了此系列第二篇文章后,有粉丝要求更新,今天写第三篇,相对来说比较简单,可以分为两个部分,一个为分割线的实现,另一个是条形跳转框,需组合搭配使用,这两类在设置,个人中心等界面中使用非常广泛

以下是本篇文章正文内容

提示:此文章部分工具类需借鉴第一篇,第二篇文章。

一、先看看实现的效果(与发表前文章的基础上)

11.jpg

12.jpg

13.png

二、实现前准备

1.dimens.xml文件内容(与第一个案例为同文件)

不占字了,请于第一篇自取

2.ids.xml文件内容(此案例可用)

    <item type="id" name="user_game_layout" />
    <item type="id" name="iv_game_icon_left" />
    <item type="id" name="iv_game_icon" />
    <item type="id" name="iv_hint_style_default" />
    <item type="id" name="tv_game_num" />
    <item type="id" name="tv_game_title" />

3.colors.xml文件内容(此案例可用)

无特殊颜色,于第一篇,第二篇自取

4.bg_set_item_selector1.xml

<?xml version="1.0" encoding="utf-8"?>
<selector
  xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:drawable="@color/jimeng_gray05" />
    <item android:drawable="@color/jimeng_white" />
</selector>

5.user_profile_item_background.xml

<?xml version="1.0" encoding="utf-8"?>
<shape android:shape="rectangle"
  xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@color/color_ffffff" />
    <stroke android:width="1.0dip" android:color="@color/color_ffffff" />
    <corners android:radius="8.0dip" />
</shape>

三、实现

1.分割线(一个为例)

    <View
        android:layout_width="fill_parent"
        android:layout_height="1.0px"
        android:layout_marginLeft="@dimen/jimeng_dp_20"
        android:layout_marginTop="@dimen/jimeng_dp_20"
        android:layout_marginRight="@dimen/jimeng_dp_20"
        android:layout_marginBottom="@dimen/jimeng_dp_8"
        android:background="@color/jimeng_gray05" />

效果图:
14.png

2.条形跳转框(一个为例)

    <LinearLayout
        android:id="@id/user_game_layout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="16.0dip"
        android:background="@drawable/user_profile_item_background"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="@dimen/jimeng_dp_45"
            android:layout_marginRight="16.0dip"
            android:background="@drawable/bg_set_item_selector1"
            android:orientation="horizontal">

            <ImageView
                android:id="@id/iv_game_icon_left"
                android:layout_width="20.0dip"
                android:layout_height="20.0dip"
                android:layout_gravity="center_vertical"
                android:layout_marginLeft="15.0dip"
                android:src="@drawable/account_icon_activity_stats" />

            <TextView
                android:id="@id/tv_game_title"
                android:layout_width="wrap_content"
                android:layout_height="fill_parent"
                android:layout_marginLeft="15.0dip"
                android:duplicateParentState="true"
                android:ellipsize="end"
                android:gravity="center_vertical"
                android:maxLength="6"
                android:maxLines="1"
                android:singleLine="true"
                android:text="数据观星"
                android:textColor="@color/jimeng_text_primary_light"
                android:textSize="14.0dip"
                android:textStyle="bold" />

            <TextView
                android:id="@id/tv_game_num"
                android:layout_width="0.0dip"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:layout_marginRight="5.0dip"
                android:layout_weight="1.0"
                android:ellipsize="end"
                android:gravity="right"
                android:maxLength="12"
                android:maxLines="1"
                android:text=""
                android:textColor="@color/jimeng_gray03"
                android:textSize="14.0dip" />

            <RelativeLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical">

                <ImageView
                    android:id="@id/iv_game_icon"
                    android:layout_width="25.0dip"
                    android:layout_height="25.0dip"
                    android:layout_marginTop="2.5dip"
                    android:layout_marginRight="15.0dip"
                    android:visibility="gone" />

                <ImageView
                    android:id="@id/iv_hint_style_default"
                    android:layout_width="9.0dip"
                    android:layout_height="9.0dip"
                    android:layout_alignParentTop="true"
                    android:layout_marginLeft="22.0dip"
                    android:background="@drawable/common_icon_notification_small"
                    android:visibility="gone" />
            </RelativeLayout>

            <ImageView
                android:layout_width="@dimen/jimeng_dp_16"
                android:layout_height="@dimen/jimeng_dp_16"
                android:layout_gravity="center_vertical"
                android:layout_marginRight="12.0dip"
                android:src="@drawable/common_icon_arrow_next_medium" />
        </LinearLayout>
    </LinearLayout>

效果图
15.png

四、使用

//将两个模块组合使用即可,可与效果图为例。
相关文章
|
28天前
|
移动开发 JavaScript 应用服务中间件
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
181 5
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
1月前
|
移动开发 前端开发 Android开发
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
230 12
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
1月前
|
移动开发 Rust JavaScript
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
488 3
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
2月前
|
存储 消息中间件 人工智能
【08】AI辅助编程完整的安卓二次商业实战-修改消息聊天框背景色-触发聊天让程序异常终止bug牵涉更多聊天消息发送优化处理-优雅草卓伊凡
【08】AI辅助编程完整的安卓二次商业实战-修改消息聊天框背景色-触发聊天让程序异常终止bug牵涉更多聊天消息发送优化处理-优雅草卓伊凡
209 10
【08】AI辅助编程完整的安卓二次商业实战-修改消息聊天框背景色-触发聊天让程序异常终止bug牵涉更多聊天消息发送优化处理-优雅草卓伊凡
|
1月前
|
移动开发 Android开发
【03】建立隐私关于等相关页面和内容-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【03】建立隐私关于等相关页面和内容-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
109 0
|
2月前
|
XML 存储 Java
【06】AI辅助编程完整的安卓二次商业实战-背景布局变更增加背景-二开发现页面跳转逻辑-替换剩余图标-优雅草卓伊凡
【06】AI辅助编程完整的安卓二次商业实战-背景布局变更增加背景-二开发现页面跳转逻辑-替换剩余图标-优雅草卓伊凡
95 3
【06】AI辅助编程完整的安卓二次商业实战-背景布局变更增加背景-二开发现页面跳转逻辑-替换剩余图标-优雅草卓伊凡
|
2月前
|
XML 编解码 Android开发
非常经典的Android开发问题-mipmap图标目录和drawable图标目录的区别和适用场景实战举例-优雅草卓伊凡
非常经典的Android开发问题-mipmap图标目录和drawable图标目录的区别和适用场景实战举例-优雅草卓伊凡
172 0
非常经典的Android开发问题-mipmap图标目录和drawable图标目录的区别和适用场景实战举例-优雅草卓伊凡
|
2月前
|
开发工具 Android开发
X Android SDK file not found: adb.安卓开发常见问题-Android SDK 缺少 `adb`(Android Debug Bridge)-优雅草卓伊凡
X Android SDK file not found: adb.安卓开发常见问题-Android SDK 缺少 `adb`(Android Debug Bridge)-优雅草卓伊凡
463 11
X Android SDK file not found: adb.安卓开发常见问题-Android SDK 缺少 `adb`(Android Debug Bridge)-优雅草卓伊凡
|
2月前
|
Java 开发工具 Maven
【01】完整的安卓二次商业实战-详细的初级步骤同步项目和gradle配置以及开发思路-优雅草伊凡
【01】完整的安卓二次商业实战-详细的初级步骤同步项目和gradle配置以及开发思路-优雅草伊凡
188 6
|
4月前
|
安全 数据库 Android开发
在Android开发中实现两个Intent跳转及数据交换的方法
总结上述内容,在Android开发中,Intent不仅是活动跳转的桥梁,也是两个活动之间进行数据交换的媒介。运用Intent传递数据时需注意数据类型、传输大小限制以及安全性问题的处理,以确保应用的健壯性和安全性。
335 11

热门文章

最新文章