安卓开发 顶部工具栏 带返回功能 仿手机QQ顶部工具条

2023-10-18 09:59

本文主要是介绍安卓开发 顶部工具栏 带返回功能 仿手机QQ顶部工具条,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

开发环境搭建   http://blog.csdn.net/juyangjia/article/details/9471561
HelloWorld http://blog.csdn.net/juyangjia/article/details/9491781
欢迎动画制作 http://blog.csdn.net/juyangjia/article/details/9494961
菜单制作 http://blog.csdn.net/juyangjia/article/details/9612287
底部tab制作 http://blog.csdn.net/juyangjia/article/details/9616299

一、前言

        尝试制作微信右上角的那个魔术棒按钮的功能,尝试失败了,下次再做,今天这个教程将不再像之前那样,怎么新建,选哪个选项我都详细的截图,大家看过我前面几篇教程就应该知道如何新建各种安卓目录、文件了。另外,现在给大家解释几个问题:

          1. Activity的切换:事实上这个是栈来实现的,每次打开一个新的页面,都是压入到栈中(不知道栈是什么的请百度吧),这就是为什么我们使用手机打开很多个页面还可以“返回”(前提是activity没被finish掉)

           2.  细心的朋友可以看到图片里有很多.9.png,这个.9是什么意思?我也不好解释,想知道详细的就百度吧,目前我就知道这是安卓里面很常用的一种图片,这种图片他在图片四周各有1个像素的空白区域,然后会有1条1像素的黑色线条,这种图片可以被安卓拉伸而不变成马赛克,类似web里面经常会用一小块8*8像素的纯色图片通过css自动填充整个背景,相比一个1024*768的纯色图片,可以省下不少空间。

          3. 学习安卓,一旦你真正的做app的时候必须要了解activity的生命周期,如果你没在网上百度,我也不告诉你,你肯定不相信手机横屏竖屏转换的时候界面会被重新create一次,你页面上输入的数据会丢失,解决这个问题的关键就是了解页面生命周期,然后做到何时保存数据,何时恢复。如果前面每一个教程你都认真的练习了,那么到这里你就可以去百度学Activity的生命周期了。

           4. 一个布局layout文件是可以嵌套在其他layout中的,例如我们今天要做的顶部工具栏,你不能每个需要工具栏的页面都复制上一段工具栏的布局xml吧?引用才是最明智的办法。

          5. 不得不说安卓的开发很灵活,布局xml、图像相关的xml(selector)、style样式文件,他们都够来来回回的引用,要不了多一会你就会把自己搞混乱,所以一开始有个规范的命名非常重要,例如在drawable下可以放上a.xml和a.png,在引用的时候你只需要写:@drawable/a,你能告诉我你这是引用的图片还是selector?

         6. 从现在开始,drawable文件夹我开始区分高分辨率、低分辨率、中等分辨率了,安卓会根据手机的分辨率自动选择调用哪个文件夹下的资源。                                           

二、制作步骤

         前面说了,今天开始教程都不再截哪些新建文件的图了。

 效果图:

1.和之前一样,第一步都是准备材料-图片

 

2.新建2个selector文件,名称如下:

 

 

内容如下:

 left:

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

right:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_enabled="true" android:state_pressed="true" android:drawable="@drawable/top_button_rightpress"/>
<item android:state_enabled="true" android:state_pressed="false" android:drawable="@drawable/top_button_right"/>
<!--<item android:drawable="@drawable/top_rightbtn_normal"/>-->
</selector>


 

3.新建一个xml布局文件,这个文件中只有工具条

 

text模式:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="@+id/title_bar"
>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_height="40dp"
android:background="@drawable/tool_bar_bg_pic">
<Button
android:id="@+id/btn_title_left"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:background="@drawable/top_left_button"
android:text="返回"
android:layout_marginLeft="7px"
android:textSize="12sp"
android:textColor="#ffffffff"
android:gravity="center_vertical|center_horizontal"
android:layout_alignParentLeft="true"/>
<TextView
android:id="@+id/tv_top_title"
android:layout_width="127dp"
android:layout_height="48dp"
android:text="SNT"
android:layout_centerInParent="true"
android:gravity="center_horizontal"
android:lines="1"
android:textSize="19sp"
android:textColor="#ffffffff" android:layout_marginTop="10dp"/>
<Button
android:id="@+id/btn_title_right"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:background="@drawable/top_right_button"
android:text="更多"
android:textSize="12sp"
android:textColor="#ffffffff"
android:gravity="center_vertical|center_horizontal" android:layout_alignParentRight="true"
android:layout_marginRight="7dp"/>
</RelativeLayout>
</RelativeLayout>

这里我要解释下,我用了RelativeLayout容器来布局, 在相对布局的情况下我们才能给中间的2个按钮和一个文本显示区域设置位置,一个设置靠左(android:layout_alignParentLeft="true"),一个靠右(android:layout_alignParentRight="true"),一个居中(android:layout_centerInParent="true")。

 

4.新建detailed.xml布局文件,这个就是我们将要跳转的详细页面布局

 

源码:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent" android:background="@drawable/main_bg">
<include layout="@layout/title_bar"/>
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="New Text"
android:id="@+id/textView" android:layout_gravity="left|center_vertical" android:textColor="#ff000000"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="隐藏按钮"
android:id="@+id/button" android:layout_gravity="left|center_vertical"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="显示按钮"
android:id="@+id/button1" android:layout_gravity="left|center_vertical"/>
</LinearLayout>
</LinearLayout>


注意看上面的include标签,本文前已经说明清楚为什么要用include。

 

5.新建detailedActivity类

 

 

6.修改view_1.xml和view1Activity类:

 

xml布局文件:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="fill_parent" android:gravity="center_vertical|center_horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="界面1"
android:id="@+id/textView"/>
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="New EditText"
android:id="@+id/editText"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="跳转"
android:id="@+id/button" android:layout_gravity="left|center_vertical"/>
</LinearLayout>

 

源码:http://download.csdn.net/detail/juyangjia/5839775

 

三、最后

               由于之前已经研究过android的http通信框架、socket通信框架、sqlite数据库(手机上的数据库),但没制作教程,下一个教程就是制作登录页面和登录功能,将讲解如下知识:

            1. 分析http和socket的连接

            2.sqlite数据库对数据的读写(记住账号)

           3.通信框架使用(apache的httpclient和mina)

 

这篇关于安卓开发 顶部工具栏 带返回功能 仿手机QQ顶部工具条的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/231830

相关文章

基于Qt开发一个简单的OFD阅读器

《基于Qt开发一个简单的OFD阅读器》这篇文章主要为大家详细介绍了如何使用Qt框架开发一个功能强大且性能优异的OFD阅读器,文中的示例代码讲解详细,有需要的小伙伴可以参考一下... 目录摘要引言一、OFD文件格式解析二、文档结构解析三、页面渲染四、用户交互五、性能优化六、示例代码七、未来发展方向八、结论摘要

最好用的WPF加载动画功能

《最好用的WPF加载动画功能》当开发应用程序时,提供良好的用户体验(UX)是至关重要的,加载动画作为一种有效的沟通工具,它不仅能告知用户系统正在工作,还能够通过视觉上的吸引力来增强整体用户体验,本文给... 目录前言需求分析高级用法综合案例总结最后前言当开发应用程序时,提供良好的用户体验(UX)是至关重要

python实现自动登录12306自动抢票功能

《python实现自动登录12306自动抢票功能》随着互联网技术的发展,越来越多的人选择通过网络平台购票,特别是在中国,12306作为官方火车票预订平台,承担了巨大的访问量,对于热门线路或者节假日出行... 目录一、遇到的问题?二、改进三、进阶–展望总结一、遇到的问题?1.url-正确的表头:就是首先ur

你的华为手机升级了吗? 鸿蒙NEXT多连推5.0.123版本变化颇多

《你的华为手机升级了吗?鸿蒙NEXT多连推5.0.123版本变化颇多》现在的手机系统更新可不仅仅是修修补补那么简单了,华为手机的鸿蒙系统最近可是动作频频,给用户们带来了不少惊喜... 为了让用户的使用体验变得很好,华为手机不仅发布了一系列给力的新机,还在操作系统方面进行了疯狂的发力。尤其是近期,不仅鸿蒙O

如何评价Ubuntu 24.04 LTS? Ubuntu 24.04 LTS新功能亮点和重要变化

《如何评价Ubuntu24.04LTS?Ubuntu24.04LTS新功能亮点和重要变化》Ubuntu24.04LTS即将发布,带来一系列提升用户体验的显著功能,本文深入探讨了该版本的亮... Ubuntu 24.04 LTS,代号 Noble NumBAT,正式发布下载!如果你在使用 Ubuntu 23.

TP-LINK/水星和hasivo交换机怎么选? 三款网管交换机系统功能对比

《TP-LINK/水星和hasivo交换机怎么选?三款网管交换机系统功能对比》今天选了三款都是”8+1″的2.5G网管交换机,分别是TP-LINK水星和hasivo交换机,该怎么选呢?这些交换机功... TP-LINK、水星和hasivo这三台交换机都是”8+1″的2.5G网管交换机,我手里的China编程has

Python基于火山引擎豆包大模型搭建QQ机器人详细教程(2024年最新)

《Python基于火山引擎豆包大模型搭建QQ机器人详细教程(2024年最新)》:本文主要介绍Python基于火山引擎豆包大模型搭建QQ机器人详细的相关资料,包括开通模型、配置APIKEY鉴权和SD... 目录豆包大模型概述开通模型付费安装 SDK 环境配置 API KEY 鉴权Ark 模型接口Prompt

在 VSCode 中配置 C++ 开发环境的详细教程

《在VSCode中配置C++开发环境的详细教程》本文详细介绍了如何在VisualStudioCode(VSCode)中配置C++开发环境,包括安装必要的工具、配置编译器、设置调试环境等步骤,通... 目录如何在 VSCode 中配置 C++ 开发环境:详细教程1. 什么是 VSCode?2. 安装 VSCo

Django中使用SMTP实现邮件发送功能

《Django中使用SMTP实现邮件发送功能》在Django中使用SMTP发送邮件是一个常见的需求,通常用于发送用户注册确认邮件、密码重置邮件等,下面我们来看看如何在Django中配置S... 目录1. 配置 Django 项目以使用 SMTP2. 创建 Django 应用3. 添加应用到项目设置4. 创建

使用 Python 和 LabelMe 实现图片验证码的自动标注功能

《使用Python和LabelMe实现图片验证码的自动标注功能》文章介绍了如何使用Python和LabelMe自动标注图片验证码,主要步骤包括图像预处理、OCR识别和生成标注文件,通过结合Pa... 目录使用 python 和 LabelMe 实现图片验证码的自动标注环境准备必备工具安装依赖实现自动标注核心