Android仿淘宝继续上拉进入商品详情页的效果,使用双Fragment动画切换;
仿淘宝继续上拉进入商品详情页的效果,双Fragment实现;

动画效果:
slide_above_in.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromYDelta="-100%p"
android:toYDelta="0%p"
android:duration="300"/>
<alpha
android:fromAlpha="0.5"
android:toAlpha="1.0"
android:duration="300"/>
</set>
slide_above_out.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:toYDelta="-100%p"
android:fromXDelta="0%p"
android:duration="300"/>
<alpha
android:fromAlpha="1.0"
android:toAlpha="0.5"
android:duration="300"/>
</set>
slide_below_in.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromYDelta="100%p"
android:toYDelta="0%p"
android:duration="300"/>
<alpha
android:fromAlpha="0.5"
android:toAlpha="1.0"
android:duration="300"/>
</set>
slide_below_out.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:toYDelta="100%p"
android:fromYDelta="0%p"
android:duration="300"/>
<alpha
android:toAlpha="0.5"
android:fromAlpha="1.0"
android:duration="300"/>
</set>
代码:
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
private FrameLayout fl;
private AboveFragment AF;
private BelowFragment BF;
private Button btn;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_double_fragment);
fl = (FrameLayout) findViewById(R.id.fl);
btn = (Button) findViewById(R.id.qiehuan);
btn.setOnClickListener(this);
AF = new AboveFragment();
BF = new BelowFragment();
initList(); //先给Fragment设置监听
getSupportFragmentManager().beginTransaction().add(R.id.fl,AF).commit();
}
private void initList() {
AF.setContinueSlideScrollView(new ContinueSlideScrollView.onContinueSlide() {
@Override
public void onContinueSlideTop() {
}
@Override
public void onContinueSlideBottom() {
if (BF.isAdded()){
getSupportFragmentManager().beginTransaction().setCustomAnimations(R.anim.slide_below_in,R.anim.slide_below_out).show(BF).commit();
}else{
getSupportFragmentManager().beginTransaction()
.setCustomAnimations(R.anim.slide_below_in,R.anim.slide_below_out)
.add(R.id.fl,BF).commit();
}
getSupportFragmentManager().beginTransaction()
.setCustomAnimations(R.anim.slide_above_in,R.anim.slide_above_out)
.hide(AF).commit();
}
});
BF.setContinueSlideScrollView(new ContinueSlideScrollView.onContinueSlide() {
@Override
public void onContinueSlideTop() {
if (AF.isAdded()){
getSupportFragmentManager().beginTransaction()
.setCustomAnimations(R.anim.slide_above_in,R.anim.slide_above_out)
.show(AF).commit();
}else{
getSupportFragmentManager().beginTransaction()
.setCustomAnimations(R.anim.slide_above_in,R.anim.slide_above_out)
.add(R.id.fl,AF).commit();
}
getSupportFragmentManager().beginTransaction()
.setCustomAnimations(R.anim.slide_below_in,R.anim.slide_below_out)
.hide(BF).commit();
}
@Override
public void onContinueSlideBottom() {
}
});
}
@Override
public void onClick(View view) {
if ("0".equals(btn.getTag().toString())){
btn.setTag("1");
if (BF.isAdded()){
getSupportFragmentManager().beginTransaction().setCustomAnimations(R.anim.slide_below_in,R.anim.slide_below_out).show(BF).commit();
}else{
getSupportFragmentManager().beginTransaction()
.setCustomAnimations(R.anim.slide_below_in,R.anim.slide_below_out)
.add(R.id.fl,BF).commit();
}
getSupportFragmentManager().beginTransaction()
.setCustomAnimations(R.anim.slide_above_in,R.anim.slide_above_out)
.hide(AF).commit();
}else{
btn.setTag("0");
if (AF.isAdded()){
getSupportFragmentManager().beginTransaction()
.setCustomAnimations(R.anim.slide_above_in,R.anim.slide_above_out)
.show(AF).commit();
}else{
getSupportFragmentManager().beginTransaction()
.setCustomAnimations(R.anim.slide_above_in,R.anim.slide_above_out)
.add(R.id.fl,AF).commit();
}
getSupportFragmentManager().beginTransaction()
.setCustomAnimations(R.anim.slide_below_in,R.anim.slide_below_out)
.hide(BF).commit();
}
}
}
其中 initList() 函数是我定义的ScrollView滑动到底部再继续滑动的监听,https://mp.csdn.net/postedit/85257597
项目这个Demo已上传Github:https://github.com/CuiChenbo/DoubleFragmentSwitch
Android仿淘宝继续上拉进入商品详情页的效果,使用双Fragment动画切换;的更多相关文章
- 高仿淘宝和聚美优品商城详情页实现《IT蓝豹》
高仿淘宝和聚美优品商城详情页实现 android-vertical-slide-view高仿淘宝和聚美优品商城详情页实现,在商品详情页,向上拖动时,可以加载下一页. 使用ViewDragHelper, ...
- 仿淘宝头像上传功能(三)——兼容 IE6 浏览器。
前两篇目录: 仿淘宝头像上传功能(一)——前端篇. 仿淘宝头像上传功能(二)——程序篇. 仿淘宝头像上传功能(三)——兼容 IE6 浏览器 之前的这两篇虽然实现了功能,但不兼容低版本浏览器,而且有些浏 ...
- Android仿淘宝头条滚动广告条
之前我使用TextView+Handler+动画,实现了一个简单的仿淘宝广告条的滚动,https://download.csdn.net/download/qq_35605213/9660825: 无 ...
- Android -- 仿淘宝广告条滚动
1,在赶项目的时候我们经常会实现下面这个功能,及添加滚动条广告广播,先看一下淘宝的效果 2,这次实现效果主要使用Android自带的ViewFlipper控件,先来看一下我们的它的基本属性和基本方法吧 ...
- Android 仿淘宝头条竖直跑马灯式新闻标题及“分页思想
在淘宝App的首页中间位置,有一块小小的地方在不知疲倦地循坏滚动着头条标题(见下图的红框区域),这样的设计无疑能够在有限的手机屏幕上展示更丰富的内容.而实现这一功能需要用到的控件就是我在上一篇文章中提 ...
- Android仿淘宝购物车demo
夏的热情渐渐退去,秋如期而至,丰收的季节,小编继续着实习之路,走着走着,就走到了购物车,逛过淘宝或者是京东的小伙伴都知道购物车里面的宝贝可不止一件,对于爱购物的姑娘来说,购物车里面的商品恐怕是爆满,添 ...
- Android 仿淘宝属性标签页
直接看效果图相信这样的效果很多,我之前在网上找了很久没找到自己想要的! <?xml version="1.0" encoding="utf-8"?> ...
- 转::iOS 仿淘宝,上拉进入详情页面
今天做的主要是一个模仿淘宝,上拉进入商品详情的功能,主要是通过 tableView 与 webView 一起来实现的,当然也可根据自己的需要把 webView 替换成你想要的 // // ViewCo ...
- 仿淘宝商品详情页上拉弹出新ViewController
新项目就要开始做了,里面有购物那块,就试着先把淘宝商品详情页的效果做了一下. 1.需求 1.第一次上拉时,A视图拉到一定距离将视图B从底部弹出,A视图也向上 2.显示B视图时下拉时,有刷新效果,之后将 ...
随机推荐
- SVN客户端使用
1.在SVN服务器添加新的用户,复制SVN URL(路径/目录). 2.在客户端电脑上下载安装SVN客户端,配置hosts文件中的内容和SVN服务器的hosts文件内容一致. hosts路径:C:\W ...
- Vue解决同一页面跳转页面不更新
问题分析:路由之间的切换,其实就是组件之间的切换,不是真正的页面切换.这也会导致一个问题,就是引用相同组件的时候,会导致该组件无法更新. 方案一:使用 watch 进行监听 watch: { /* = ...
- ubuntu 安装 nvm 管理Node.js 以及vim 插件增强
安装curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.2/install.sh | bashsource ~/.bashr ...
- angular2升级到angular4历程
Angular 4 在昨天(2017-03-24)正式发布了,我的系列教程也得更新一下.步骤略繁琐,不用 cli 的项目反倒更简单一些,但是 cli 平时给我们的便利还是很多的,升级最多半年一次而已. ...
- L328 What Is Millennial Burnout?
What Is Millennial Burnout?Do you often feel stressed? Does the pace of life make you feel like you' ...
- TensorFlow中assign函数
tf.assign assign ( ref , value , validate_shape = None , use_locking = None , name = None ) 定义在:tens ...
- 基于vue移动音乐webapp跨域请求失败的问题解决
在学习一位vue大牛的课程<VUE2.0移动端音乐App开发>时,由于vue的版本原因遇到了一些问题 这是其中之一,花费了很多的时间去解决 虽然搞定了这个问题,但是很多东西理解也不是很到位 ...
- C# 数据推送 实时数据推送 轻量级消息订阅发布 多级消息推送 分布式推送
前言 本文将使用一个NuGet公开的组件技术来实现数据订阅推送功能,由服务器进行推送数据,客户端订阅指定的数据后,即可以接收服务器推送过来的数据,包含了自动重连功能,使用非常方便 nuget地址:ht ...
- Spring 的介绍和目标
1. Spring介绍 打开Spring 官网查看对 Spring 的介绍和目标 http://www.springsource.org/about We believe that: · J2EE s ...
- google Kickstart Round G 2017 三道题题解
A题:给定A,N,P,计算A的N!次幂对P取模的结果. 数据范围: T次测试,1 ≤ T ≤ 100 1<=A,N,P<=105 快速幂一下就好了.O(nlogn). AC代码: #inc ...