{"id":13644757,"url":"https://github.com/linglongxin24/WelcomeVideoPager","last_synced_at":"2025-04-21T10:34:21.536Z","repository":{"id":40558595,"uuid":"73344957","full_name":"linglongxin24/WelcomeVideoPager","owner":"linglongxin24","description":"Android酷炫欢迎页播放视频,仿蚂蜂窝自由行和慕课网","archived":false,"fork":false,"pushed_at":"2016-11-18T05:28:26.000Z","size":18945,"stargazers_count":225,"open_issues_count":3,"forks_count":56,"subscribers_count":8,"default_branch":"master","last_synced_at":"2025-04-07T19:21:13.960Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"http://blog.csdn.net/linglongxin24/article/details/53115253","language":"Java","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/linglongxin24.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-11-10T03:44:17.000Z","updated_at":"2025-03-23T08:46:57.000Z","dependencies_parsed_at":"2022-08-27T20:32:15.448Z","dependency_job_id":null,"html_url":"https://github.com/linglongxin24/WelcomeVideoPager","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/linglongxin24%2FWelcomeVideoPager","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/linglongxin24%2FWelcomeVideoPager/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/linglongxin24%2FWelcomeVideoPager/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/linglongxin24%2FWelcomeVideoPager/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/linglongxin24","download_url":"https://codeload.github.com/linglongxin24/WelcomeVideoPager/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250040772,"owners_count":21365163,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-08-02T01:02:12.573Z","updated_at":"2025-04-21T10:34:16.525Z","avatar_url":"https://github.com/linglongxin24.png","language":"Java","funding_links":[],"categories":["启动页"],"sub_categories":[],"readme":"Android酷炫欢迎页播放视频,仿蚂蜂窝自由行和慕课网\n\u003e今天无意间看到了蚂蜂窝自由行的app，启动页很酷炫。我记得以前慕课网有个版本的app欢迎页也是播放视频的。\n今天就顺手写一个，代码比较简单，高手请略过。\n\n先看效果图：\n\n ![效果图](https://github.com/linglongxin24/WelcomeVideoPager/blob/master/screenshorts/effect.gif?raw=true)\n\n#一.资源准备\n\n三个比较短小的视频：[视频下载](https://github.com/linglongxin24/WelcomeVideoPager/tree/master/app/src/main/res/raw)\n\n#二.开始编写代码\n\n * 1.在项目的res下新建一个raw文件夹，放入准备好的这三个视频\n \n * 2.自定义播放视频的CustomVideoView\n  在这个自定义View里面提供一个播放视频的方法。用户只需要传入播放路径就可以了，并且可一循环播放。\n\n```java\npackage cn.bluemobi.dylan.welcomevideopager;\nimport android.content.Context;\nimport android.media.MediaPlayer;\nimport android.net.Uri;\nimport android.util.AttributeSet;\nimport android.view.View;\nimport android.widget.VideoView;\n\n/**\n * 可以播放视频的View\n * Created by yuandl on 2016-11-10.\n */\n\npublic class CustomVideoView extends VideoView {\n    public CustomVideoView(Context context) {\n        super(context);\n    }\n\n    public CustomVideoView(Context context, AttributeSet attrs, int defStyleAttr) {\n        super(context, attrs, defStyleAttr);\n    }\n\n    public CustomVideoView(Context context, AttributeSet attrs) {\n        super(context, attrs);\n    }\n\n    @Override\n    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {\n        super.onMeasure(widthMeasureSpec, heightMeasureSpec);\n        setMeasuredDimension(View.MeasureSpec.getSize(widthMeasureSpec), View.MeasureSpec.getSize(heightMeasureSpec));\n    }\n\n    /**\n     * 播放视频\n     *\n     * @param uri 播放地址\n     */\n    public void playVideo(Uri uri) {\n        if (uri == null) {\n            throw new IllegalArgumentException(\"Uri can not be null\");\n        }\n        /**设置播放路径**/\n        setVideoURI(uri);\n        /**开始播放**/\n        start();\n        setOnPreparedListener(new MediaPlayer.OnPreparedListener() {\n\n            @Override\n            public void onPrepared(MediaPlayer mp) {\n                /**设置循环播放**/\n                mp.setLooping(true);\n            }\n        });\n        setOnErrorListener(new MediaPlayer.OnErrorListener() {\n\n            @Override\n            public boolean onError(MediaPlayer mp, int what, int extra) {\n                return true;\n            }\n        });\n    }\n}\n```\n\n * 3.建立没个欢迎页面的Fragment去加载自定义视频View的视图\n\n```java\npackage cn.bluemobi.dylan.welcomevideopager;\n\nimport android.net.Uri;\nimport android.os.Bundle;\nimport android.support.annotation.Nullable;\nimport android.support.v4.app.Fragment;\nimport android.view.LayoutInflater;\nimport android.view.View;\nimport android.view.ViewGroup;\n\n/**\n * Created by yuandl on 2016-11-10.\n */\n\npublic class GuildFragment extends Fragment {\n\n    private CustomVideoView customVideoView;\n\n    @Nullable\n    @Override\n    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {\n        customVideoView = new CustomVideoView(getContext());\n        /**获取参数，根据不同的参数播放不同的视频**/\n        int index = getArguments().getInt(\"index\");\n        Uri uri;\n        if (index == 1) {\n            uri = Uri.parse(\"android.resource://\" + getActivity().getPackageName() + \"/\" + R.raw.guide_1);\n        } else if (index == 2) {\n            uri = Uri.parse(\"android.resource://\" + getActivity().getPackageName() + \"/\" + R.raw.guide_2);\n        } else {\n            uri = Uri.parse(\"android.resource://\" + getActivity().getPackageName() + \"/\" + R.raw.guide_3);\n        }\n        /**播放视频**/\n        customVideoView.playVideo(uri);\n        return customVideoView;\n    }\n\n    /**\n     * 记得在销毁的时候让播放的视频终止\n     */\n    @Override\n    public void onDestroy() {\n        super.onDestroy();\n        if (customVideoView != null) {\n            customVideoView.stopPlayback();\n        }\n    }\n}\n\n```\n * 4.界面布局\n \n```xml\n\u003cRelativeLayout xmlns:android=\"http://schemas.android.com/apk/res/android\"\n    android:layout_width=\"match_parent\"\n    android:layout_height=\"match_parent\"\u003e\n\n    \u003candroid.support.v4.view.ViewPager\n        android:id=\"@+id/vp\"\n        android:layout_width=\"match_parent\"\n        android:layout_height=\"match_parent\"\u003e\u003c/android.support.v4.view.ViewPager\u003e\n\n    \u003cLinearLayout\n        android:layout_width=\"wrap_content\"\n        android:layout_height=\"wrap_content\"\n        android:layout_alignParentBottom=\"true\"\n        android:layout_centerHorizontal=\"true\"\n        android:layout_marginBottom=\"130dp\"\n        android:orientation=\"horizontal\"\u003e\n\n        \u003cImageView\n            android:id=\"@+id/iv1\"\n            android:layout_width=\"10dp\"\n            android:layout_height=\"10dp\"\n            android:src=\"@mipmap/dot_focus\" /\u003e\n\n        \u003cImageView\n            android:id=\"@+id/iv2\"\n            android:layout_width=\"10dp\"\n            android:layout_height=\"10dp\"\n            android:layout_marginLeft=\"10dp\"\n            android:src=\"@mipmap/dot_normal\" /\u003e\n\n        \u003cImageView\n            android:id=\"@+id/iv3\"\n            android:layout_width=\"10dp\"\n            android:layout_height=\"10dp\"\n            android:layout_marginLeft=\"10dp\"\n            android:src=\"@mipmap/dot_normal\" /\u003e\n    \u003c/LinearLayout\u003e\n\n    \u003cButton\n        android:id=\"@+id/bt_start\"\n        android:layout_width=\"wrap_content\"\n        android:layout_height=\"wrap_content\"\n        android:layout_alignParentBottom=\"true\"\n        android:layout_centerHorizontal=\"true\"\n        android:layout_marginBottom=\"50dp\"\n        android:background=\"@mipmap/bt_start\"\n        android:textColor=\"@android:color/white\"\n        android:visibility=\"gone\" /\u003e\n\n\u003c/RelativeLayout\u003e\n```\n \n * 5.给界面添加Fragment\n \n```java\npackage cn.bluemobi.dylan.welcomevideopager;\n\nimport android.os.Bundle;\nimport android.support.v4.app.Fragment;\nimport android.support.v4.app.FragmentManager;\nimport android.support.v4.app.FragmentPagerAdapter;\nimport android.support.v4.view.ViewPager;\nimport android.support.v7.app.AppCompatActivity;\nimport android.view.View;\nimport android.widget.Button;\nimport android.widget.ImageView;\n\nimport java.util.ArrayList;\nimport java.util.List;\n\npublic class MainActivity extends AppCompatActivity {\n    private ViewPager vp;\n    private ImageView iv1;\n    private ImageView iv2;\n    private ImageView iv3;\n    private Button bt_start;\n    private List\u003cFragment\u003e fragments;\n\n    private void assignViews() {\n        vp = (ViewPager) findViewById(R.id.vp);\n        iv1 = (ImageView) findViewById(R.id.iv1);\n        iv2 = (ImageView) findViewById(R.id.iv2);\n        iv3 = (ImageView) findViewById(R.id.iv3);\n        bt_start = (Button) findViewById(R.id.bt_start);\n    }\n\n    @Override\n    protected void onCreate(Bundle savedInstanceState) {\n        super.onCreate(savedInstanceState);\n        setContentView(R.layout.activity_main);\n        assignViews();\n        initData();\n        initView();\n\n    }\n\n    /**\n     * 初始化数据,添加三个Fragment\n     */\n    private void initData() {\n        fragments = new ArrayList\u003c\u003e();\n\n        Fragment fragment1 = new GuildFragment();\n        Bundle bundle1 = new Bundle();\n        bundle1.putInt(\"index\", 1);\n        fragment1.setArguments(bundle1);\n        fragments.add(fragment1);\n\n        Fragment fragment2 = new GuildFragment();\n        Bundle bundle2 = new Bundle();\n        bundle2.putInt(\"index\", 2);\n        fragment2.setArguments(bundle2);\n        fragments.add(fragment2);\n\n        Fragment fragment3 = new GuildFragment();\n        Bundle bundle3 = new Bundle();\n        bundle3.putInt(\"index\", 3);\n        fragment3.setArguments(bundle3);\n        fragments.add(fragment3);\n    }\n\n    /**\n     * 设置ViewPager的适配器和滑动监听\n     */\n    private void initView() {\n        vp.setOffscreenPageLimit(3);\n        vp.setAdapter(new MyPageAdapter(getSupportFragmentManager()));\n        vp.addOnPageChangeListener(new MyPageChangeListener());\n    }\n\n    /**\n     * ViewPager适配器\n     */\n    private class MyPageAdapter extends FragmentPagerAdapter {\n\n\n        public MyPageAdapter(FragmentManager fm) {\n            super(fm);\n        }\n\n        @Override\n        public Fragment getItem(int position) {\n            return fragments.get(position);\n        }\n\n        @Override\n        public int getCount() {\n            return fragments.size();\n        }\n    }\n\n    /**\n     * ViewPager滑动页面监听器\n     */\n    private class MyPageChangeListener implements ViewPager.OnPageChangeListener {\n        @Override\n        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {\n\n        }\n\n        /**\n         * 根据页面不同动态改变红点和在最后一页显示立即体验按钮\n         *\n         * @param position\n         */\n        @Override\n        public void onPageSelected(int position) {\n            bt_start.setVisibility(View.GONE);\n            iv1.setImageResource(R.mipmap.dot_normal);\n            iv2.setImageResource(R.mipmap.dot_normal);\n            iv3.setImageResource(R.mipmap.dot_normal);\n            if (position == 0) {\n                iv1.setImageResource(R.mipmap.dot_focus);\n            } else if (position == 1) {\n                iv2.setImageResource(R.mipmap.dot_focus);\n            } else {\n                iv3.setImageResource(R.mipmap.dot_focus);\n                bt_start.setVisibility(View.VISIBLE);\n            }\n        }\n\n        @Override\n        public void onPageScrollStateChanged(int state) {\n\n        }\n    }\n}\n\n```\n#三.[GitHub](https://github.com/linglongxin24/WelcomeVideoPager)\n \n\u003e注意：如果视频是有声音的话是会有问题的，由于Fragment的预加载机制。具体解决方案请看这里[Android中ViewPager+Fragment取消(禁止)预加载延迟加载(懒加载)问题解决方案](http://blog.csdn.net/linglongxin24/article/details/53205878) \n在本Demo中可以将GuildFragment替换为Guild2Fragment可以查看解决后的效果。","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flinglongxin24%2FWelcomeVideoPager","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flinglongxin24%2FWelcomeVideoPager","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flinglongxin24%2FWelcomeVideoPager/lists"}