热门标签 | HotTags
当前位置:  开发笔记 > Android > 正文

Android模仿To圈儿个人资料界面层叠淡入淡出显示效果

这篇文章主要介绍了Android模仿To圈儿个人资料界面层叠淡入淡出显示效果的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下

前几天做的一个仿To圈个人资料界面的实现效果

下面是To圈的效果Gif图:

做这个东西其实也花了一下午的时间,一开始思路一直没理清楚,就开始盲目的去做,结果反而事倍功半。

以后要吸取教训,先详细思考清楚其中的逻辑关系,然后再开始动手写代码,这样比较容易理顺。

可以看到实现这个效果还是不难的,得分成以下三个步骤:

1:首先要有一个可拖动的详细资料布局(下半部分)。

2:上半部分可跟随移动。

3:标题栏由隐藏到显示。

涉及到的技术点有:

1:屏幕像素密度DP转化。

2:自定义视图的OnTouchListener事件

3:透明度属性动画的使用

根据这三个要求,设计的布局如下:

userinfo_layout.xml

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

该布局由内而外嵌套了三层,其中上半部分我直接截了To圈的图。

android:background="@drawable/top"

代码实现:

package com.whale.nangua.toquan; 
import android.animation.ObjectAnimator; 
import android.app.Activity; 
import android.content.Context; 
import android.os.Bundle; 
import android.support.v7.app.AppCompatActivity; 
import android.util.Log; 
import android.view.MotionEvent; 
import android.view.View; 
import android.view.ViewGroup; 
import android.widget.ImageView; 
import android.widget.LinearLayout; 
import android.widget.RelativeLayout; 
import android.widget.ScrollView; 
import android.widget.Toast; 
public class MainActivity extends Activity { 
LinearLayout myscrollLinearlayout; 
LinearLayout mainheadview; //顶部个人资料视图 
RelativeLayout mainactionbar; //顶部菜单栏 
@Override 
protected void onCreate(Bundle savedInstanceState) { 
super.onCreate(savedInstanceState); 
setContentView(R.layout.userinfo_layout); 
initView(); 
} 
int Y; 
int position = 0; //拖动Linearlayout的距离Y轴的距离 
int scrollviewdistancetotop = 0; //headView的高 
int menubarHeight = 0; 
int chufaHeight = 0; //需要触发动画的高 
float scale; //像素密度 
int headViewPosition = 0; 
ImageView userinfo_topbar; 
static boolean flag = true; 
static boolean topmenuflag = true; 
private void initView() { 
userinfo_topbar = (ImageView) findViewById(R.id.userinfo_topbar); 
//获得像素密度 
scale = this.getResources().getDisplayMetrics().density; 
mainheadview = (LinearLayout) findViewById(R.id.mainheadview); 
mainactiOnbar= (RelativeLayout) findViewById(R.id.mainactionbar); 
menubarHeight = (int) (55 * scale); 
chufaHeight = (int) (110 * scale); 
scrollviewdistancetotop = (int) ((260 )*scale); 
position = scrollviewdistancetotop; 
myscrollLinearlayout = (LinearLayout) findViewById(R.id.myscrollLinearlayout); 
myscrollLinearlayout.setY( scrollviewdistancetotop); //要减去Absolote布局距离顶部的高度 
myscrollLinearlayout.setOnClickListener(new View.OnClickListener() { 
@Override 
public void onClick(View v) { 
} 
}); 
myscrollLinearlayout.setOnTouchListener(new View.OnTouchListener() { 
@Override 
public boolean onTouch(View v, MotionEvent event) { 
switch (event.getAction()) { 
case MotionEvent.ACTION_DOWN: 
//按下的Y的位置 
Y = (int) event.getRawY(); 
break; 
case MotionEvent.ACTION_MOVE: 
int nowY = (int) myscrollLinearlayout.getY(); //拖动界面的Y轴位置 
int tempY = (int) (event.getRawY() - Y); //手移动的偏移量 
Y = (int) event.getRawY(); 
if ((nowY + tempY >= 0) && (nowY + tempY <= scrollviewdistancetotop)) { 
if ((nowY + tempY <= menubarHeight)&& (topmenuflag == true) ){ 
userinfo_topbar.setVisibility(View.VISIBLE); 
topmenuflag = false; 
} else if ((nowY + tempY > menubarHeight) && (topmenuflag == flag)) { 
userinfo_topbar.setVisibility(View.INVISIBLE); 
topmenuflag = true; 
} 
int temp = position += tempY; 
myscrollLinearlayout.setY(temp); 
int headviewtemp = headViewPosition += (tempY/5); 
mainheadview.setY(headviewtemp); 
} 
//顶部的动画效果 
if ((myscrollLinearlayout.getY() <= chufaHeight) && (flag == true)) { 
ObjectAnimator anim = ObjectAnimator.ofFloat(mainheadview, "alpha", 1, 0.0f); 
anim.setDuration(500); 
anim.start(); 
flag = false; 
} else if ((myscrollLinearlayout.getY() > chufaHeight + 40) && (flag == false)) { 
ObjectAnimator anim = ObjectAnimator.ofFloat(mainheadview, "alpha", 0.0f, 1f); 
anim.setDuration(500); 
anim.start(); 
flag = true; 
} 
break; 
} 
return false; 
} 
}); 
} 
}

代码实现思路:

主要是对以下三个Layout的操作:

LinearLayout myscrollLinearlayout; //底部可拖动的详细界面
LinearLayout mainheadview; //顶部个人资料视图
RelativeLayout mainactionbar; //顶部菜单栏

首先初始化各个布局部分的位置,然后主要是底部拖动布局的动态事件监听。

需要在这个监听方法中处理与另外两个布局的交互,这一点比较麻烦,不过代码里都有详细的注释。

然后这是我实现的效果图:

可以看到跟To圈的效果几乎一模一样哦。

以上所述是小编给大家介绍的Android模仿To圈儿个人资料界面层叠淡入淡出显示效果,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!


推荐阅读
  • 本文深入探讨了 AdoDataSet RecordSet 的序列化与反序列化技术,详细解析了将 RecordSet 转换为 XML 格式的方法。通过使用 Variant 类型变量和 TStringStream 流对象,实现数据集的高效转换与存储。该方法不仅提高了数据传输的灵活性,还增强了数据处理的兼容性和可扩展性。 ... [详细]
  • 如果你对 IntelliJ IDEA 的界面不太熟悉,可能会对如何在 Android Studio 中执行一些常见任务感到困惑。本文提供了多种开发技巧和实用窍门,帮助开发者更好地利用 Android Studio 的强大功能,包括界面导航、代码调试和项目管理等方面,使开发过程更加高效顺畅。 ... [详细]
  • 本文深入探讨了Windows操作系统中线程同步机制的关键技术,重点分析了`WaitForSingleObject`和`Event`的使用方法及其应用场景。通过详细介绍`CreateEvent`函数的创建过程及其在判断线程退出和实现线程间同步中的重要作用,结合具体实例,展示了如何高效地利用这些工具来解决多线程编程中的常见问题。此外,文章还讨论了这些机制在实际开发中的最佳实践和注意事项,为开发者提供了宝贵的参考。 ... [详细]
  • 题目要求在给定的数组中找到一个连续子数组,使其乘积最大。本文详细介绍了使用动态规划算法解决这一问题的方法,包括状态定义、状态转移方程和初始化步骤。通过具体的例子和代码实现,帮助读者深入理解该算法的核心思想和实现细节。 ... [详细]
  • 本文将详细介绍如何利用JMeter高效执行API接口测试,涵盖JMeter的基础介绍、安装方法、中文环境配置、主要元件及其作用域和执行顺序等内容,并分享一系列实用的测试技巧,帮助读者全面掌握JMeter接口测试的全过程。 ... [详细]
  • Dapper:一款高效轻量的ORM框架
    Dapper 是一个高效且轻量级的 ORM(对象关系映射)框架,由 StackExchange 开发并维护。它旨在提供快速的数据访问性能,同时保持代码的简洁性和易用性。Dapper 可以显著提高开发效率,特别适用于需要高性能数据操作的应用场景。更多详细信息可参考其官方文档和 GitHub 仓库。 ... [详细]
  • 在Tomcat启动过程中,遇到了 `java.io.EOFException` 异常,具体表现为 `ObjectInputStream$PeekInputStream.readFully` 方法读取数据时出现不完整的情况。该问题通常由输入流提前结束或数据传输不完整引起,需要检查数据源的完整性和网络连接的稳定性。 ... [详细]
  • EasyUI作为一种高效的前端框架,显著简化了JavaScript代码的编写,提升了开发效率。在构建窗口应用程序时,首先需要引入EasyUI所需的JS文件和CSS样式表。由于EasyUI依赖于jQuery,因此还需确保正确加载jQuery库。通过这种方式,开发者能够快速实现界面组件的动态交互与美观布局,为用户提供更加流畅的使用体验。 ... [详细]
  • 兰州大学科研团队在项目实践中进行了深入的反思与总结。尽管项目已正式完成,但后续可能仍需持续优化和调整。团队成员对项目的顺利推进表示欣慰,同时也对未来的改进充满期待。目前,项目维护费用尚未到位,但这并未影响团队的积极性和对未来工作的热情。 ... [详细]
  • 触发器是数据库中一种特殊类型的存储过程,其执行依赖于预定义的事件,而非直接调用。在数据库管理中,触发器主要用于实现数据完整性、自动化日志记录及复杂业务规则的执行。当对数据库中的表、视图等对象进行插入、更新或删除操作时,系统将自动激活相关的触发器,以确保数据的一致性和安全性。此外,通过合理设计和优化触发器,还可以显著提升数据库性能和响应速度。 ... [详细]
  • Android数组截取技巧及JNI数组交互在仓库构建中的应用分析
    在Android开发中,数组截取技巧和JNI数组交互在仓库构建中的应用具有重要意义。JNI提供了两种主要的数组处理方法:一是生成原生层数组的副本,二是直接通过数组指针进行操作。在进行字符串处理时,如果需要执行其他复杂操作,可以结合这两种方法以提高效率和灵活性。此外,合理利用这些技术可以显著提升应用程序的性能和稳定性。 ... [详细]
  • 超链接作为网页间的重要连接方式,不仅是信息流动的关键通道,还极大地提升了网络资源的可访问性和互联性。通过超链接,用户能够便捷地在不同网站和页面之间跳转,获取所需信息,促进了互联网内容的广泛传播与高效利用。 ... [详细]
  • 深入解析:开发笔记中的 this、call、bind 和 apply 方法详解
    深入解析:开发笔记中的 this、call、bind 和 apply 方法详解 ... [详细]
  • 第一次写这玩意,不知道什么时候能写完,今天项目比较近,期望年底能看完吧。先定个小目标20201228完成第1章Spring介绍第2章入门第3章在Spring中引入IoC和DI第4章 ... [详细]
  • classpath和classpath*区别:classpath:只会到你的class路径中查找找文件。classpath*:不仅包含class路径,还包括jar文件中(class ... [详细]
author-avatar
梦之舞的微薄极_922
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有