9).Android Jetpack 一个demo两分钟ViewPager2 (实现抖音App上下滑动)

18 篇文章 1 订阅
16 篇文章 0 订阅

ViewPager2+Fragment+tablayout

https://www.jianshu.com/p/351e695015d4

ViewPager2 是 ViewPager 库的改进版本,可提供增强型功能并解决使用 ViewPager 时遇到的一些问题

ViewPager有两个弊端:1.不能关闭预加载;2.更新adapter不生效
我们在加载数据的时候,viewpager默认会帮我们预加载前后两个页面的数据,并且这2个view是不可见的。而目前ViewPager2对Fragment支持只能用FragmentStateAdapter,FragmentStateAdapter在遇到预加载时,只会创建Fragment对象,不会把Fragment真正的加入到布局中,所以自带懒加载效果

 

https://mp.weixin.qq.com/s/MOWdbI5IREjQP1Px-WJY1Q

 

Android ViewPager2的特性

  • 从右到左的布局支持
  • 垂直方向
  • RecyclerView.Adapter取代PagerAdapter
  • registerOnPageChangeCallback 取代 addPageChangeListener
  • 更高效的notifyDataSetChanged

      支持Fragment切换的动画
 

 

ViewPager2与RecycleView的结合使用

 

public class MainActivity extends AppCompatActivity {
    ViewPager2 mviewPager2;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mviewPager2 = findViewById(R.id.viewpager2);
        List<String> list = new ArrayList<>();
        list.add("页面一");
        list.add("页面二");
        list.add("页面三");
        list.add("页面四");


        mviewPager2.setOrientation(ViewPager2.ORIENTATION_HORIZONTAL);

        mviewPager2.setAdapter(new ViewPagerAdapter(this, list, mviewPager2));

        mviewPager2.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                super.onPageScrolled(position, positionOffset, positionOffsetPixels);
            }
        });

    }
}

 

 

 

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.RelativeLayout;
import android.widget.TextView;

import java.util.List;

import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;
import androidx.viewpager2.widget.ViewPager2;

/**
 * @Author: wuchaowen
 * @Description:
 * @Time:
 **/
public class ViewPagerAdapter extends RecyclerView.Adapter<ViewPagerAdapter.ViewHolder> {
    private List<String> mData;
    private LayoutInflater mInflater;
    private ViewPager2 viewPager2;


    private int[] colorArray = new int[]{android.R.color.black, android.R.color.holo_blue_dark, android.R.color.holo_green_dark, android.R.color.holo_red_dark};


    public ViewPagerAdapter(Context context, List<String> data, ViewPager2 viewPager2) {
        this.mInflater = LayoutInflater.from(context);
        this.mData = data;
        this.viewPager2 = viewPager2;
    }

    @NonNull
    @Override
    public ViewPagerAdapter.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View view = mInflater.inflate(R.layout.recycleview_item, parent, false);
        return new ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(@NonNull ViewPagerAdapter.ViewHolder holder, int position) {
        String animal = mData.get(position);
        holder.myTextView.setText(animal);
        holder.relativeLayout.setBackgroundResource(colorArray[position]);

    }

    @Override
    public int getItemCount() {
        return mData.size();
    }

    public class ViewHolder extends RecyclerView.ViewHolder {
        TextView myTextView;
        RelativeLayout relativeLayout;

        ViewHolder(View itemView) {
            super(itemView);
            myTextView = itemView.findViewById(R.id.tvTitle);
            relativeLayout = itemView.findViewById(R.id.container);

        }
    }
}
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
实现类似抖音上下滑动切换视频的功能,可以使用Jetpack Compose中的`LazyColumn`和`Pager`组件。 首先,我们需要准备一些视频数据,可以使用一个包含视频URL的列表: ```kotlin val videos = listOf( "https://example.com/video1.mp4", "https://example.com/video2.mp4", "https://example.com/video3.mp4", // ... ) ``` 然后,我们可以使用`LazyColumn`和`Pager`组件来实现上下滑动和视频切换的功能: ```kotlin LazyColumn { val pagerState = rememberPagerState(pageCount = videos.size) items(count = videos.size) { index -> val videoUrl = videos[index] Pager( state = pagerState, modifier = Modifier.fillMaxWidth(), ) { VideoPlayer(videoUrl) } } } ``` 在上面的代码中,我们首先创建了一个`PagerState`,用于管理视频的切换。然后,我们使用`LazyColumn`组件创建一个垂直滚动列表,每个列表项都是一个`Pager`组件,用于显示一个视频。`Pager`组件的`state`属性绑定了`PagerState`,`modifier`属性设置了组件的宽度为最大,这样视频就可以充满屏幕了。`Pager`组件的内容是一个自定义的`VideoPlayer`组件,用于播放视频。 最后,我们需要实现`VideoPlayer`组件,可以使用`VideoView`和`ExoPlayer`来播放视频。下面是一个简单的`VideoPlayer`组件的实现: ```kotlin @Composable fun VideoPlayer(url: String) { val context = LocalContext.current val videoView = remember { VideoView(context).apply { layoutParams = ViewGroup.LayoutParams( ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT ) setMediaController(MediaController(context)) setOnPreparedListener(MediaPlayer.OnPreparedListener { mp -> mp.isLooping = true }) } } AndroidView( factory = { videoView }, update = { it.setVideoURI(Uri.parse(url)) it.start() } ) } ``` 在上面的代码中,我们首先使用`remember`来创建一个`VideoView`实例,然后使用`AndroidView`组件将其包装成一个Compose组件。在`AndroidView`组件的`update`块中,我们设置`VideoView`的视频URL并开始播放。这样就可以在`Pager`组件中显示一个视频并自动播放了。 以上就是使用Jetpack Compose实现类似抖音上下滑动切换视频的简单示例。当然,这只是一个基础实现,你还可以根据自己的需求进行扩展和优化。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值