仿淘宝继续上拉进入商品详情页的效果,双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动画切换;的更多相关文章

  1. 高仿淘宝和聚美优品商城详情页实现《IT蓝豹》

    高仿淘宝和聚美优品商城详情页实现 android-vertical-slide-view高仿淘宝和聚美优品商城详情页实现,在商品详情页,向上拖动时,可以加载下一页. 使用ViewDragHelper, ...

  2. 仿淘宝头像上传功能(三)——兼容 IE6 浏览器。

    前两篇目录: 仿淘宝头像上传功能(一)——前端篇. 仿淘宝头像上传功能(二)——程序篇. 仿淘宝头像上传功能(三)——兼容 IE6 浏览器 之前的这两篇虽然实现了功能,但不兼容低版本浏览器,而且有些浏 ...

  3. Android仿淘宝头条滚动广告条

    之前我使用TextView+Handler+动画,实现了一个简单的仿淘宝广告条的滚动,https://download.csdn.net/download/qq_35605213/9660825: 无 ...

  4. Android -- 仿淘宝广告条滚动

    1,在赶项目的时候我们经常会实现下面这个功能,及添加滚动条广告广播,先看一下淘宝的效果 2,这次实现效果主要使用Android自带的ViewFlipper控件,先来看一下我们的它的基本属性和基本方法吧 ...

  5. Android 仿淘宝头条竖直跑马灯式新闻标题及“分页思想

    在淘宝App的首页中间位置,有一块小小的地方在不知疲倦地循坏滚动着头条标题(见下图的红框区域),这样的设计无疑能够在有限的手机屏幕上展示更丰富的内容.而实现这一功能需要用到的控件就是我在上一篇文章中提 ...

  6. Android仿淘宝购物车demo

    夏的热情渐渐退去,秋如期而至,丰收的季节,小编继续着实习之路,走着走着,就走到了购物车,逛过淘宝或者是京东的小伙伴都知道购物车里面的宝贝可不止一件,对于爱购物的姑娘来说,购物车里面的商品恐怕是爆满,添 ...

  7. Android 仿淘宝属性标签页

    直接看效果图相信这样的效果很多,我之前在网上找了很久没找到自己想要的! <?xml version="1.0" encoding="utf-8"?> ...

  8. 转::iOS 仿淘宝,上拉进入详情页面

    今天做的主要是一个模仿淘宝,上拉进入商品详情的功能,主要是通过 tableView 与 webView 一起来实现的,当然也可根据自己的需要把 webView 替换成你想要的 // // ViewCo ...

  9. 仿淘宝商品详情页上拉弹出新ViewController

    新项目就要开始做了,里面有购物那块,就试着先把淘宝商品详情页的效果做了一下. 1.需求 1.第一次上拉时,A视图拉到一定距离将视图B从底部弹出,A视图也向上 2.显示B视图时下拉时,有刷新效果,之后将 ...

随机推荐

  1. SVN客户端使用

    1.在SVN服务器添加新的用户,复制SVN URL(路径/目录). 2.在客户端电脑上下载安装SVN客户端,配置hosts文件中的内容和SVN服务器的hosts文件内容一致. hosts路径:C:\W ...

  2. Vue解决同一页面跳转页面不更新

    问题分析:路由之间的切换,其实就是组件之间的切换,不是真正的页面切换.这也会导致一个问题,就是引用相同组件的时候,会导致该组件无法更新. 方案一:使用 watch 进行监听 watch: { /* = ...

  3. ubuntu 安装 nvm 管理Node.js 以及vim 插件增强

    安装curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.2/install.sh | bashsource ~/.bashr ...

  4. angular2升级到angular4历程

    Angular 4 在昨天(2017-03-24)正式发布了,我的系列教程也得更新一下.步骤略繁琐,不用 cli 的项目反倒更简单一些,但是 cli 平时给我们的便利还是很多的,升级最多半年一次而已. ...

  5. L328 What Is Millennial Burnout?

    What Is Millennial Burnout?Do you often feel stressed? Does the pace of life make you feel like you' ...

  6. TensorFlow中assign函数

    tf.assign assign ( ref , value , validate_shape = None , use_locking = None , name = None ) 定义在:tens ...

  7. 基于vue移动音乐webapp跨域请求失败的问题解决

    在学习一位vue大牛的课程<VUE2.0移动端音乐App开发>时,由于vue的版本原因遇到了一些问题 这是其中之一,花费了很多的时间去解决 虽然搞定了这个问题,但是很多东西理解也不是很到位 ...

  8. C# 数据推送 实时数据推送 轻量级消息订阅发布 多级消息推送 分布式推送

    前言 本文将使用一个NuGet公开的组件技术来实现数据订阅推送功能,由服务器进行推送数据,客户端订阅指定的数据后,即可以接收服务器推送过来的数据,包含了自动重连功能,使用非常方便 nuget地址:ht ...

  9. Spring 的介绍和目标

    1. Spring介绍 打开Spring 官网查看对 Spring 的介绍和目标 http://www.springsource.org/about We believe that: · J2EE s ...

  10. 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 ...