Android项目里的图片轮换

最新推荐文章于 2020-05-15 18:52:12 发布

原创最新推荐文章于 2020-05-15 18:52:12 发布 · 551 阅读

1 ·

CC 4.0 BY-SA版权

Android 专栏收录该内容

29 篇文章

订阅专栏

本文介绍如何使用Android中的ViewPager组件结合自定义指示器实现流畅的图片轮播效果，并通过线程池定时更新展示页面。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

代码演示:

1.activity布局,线性布局中套布局

<FrameLayout

    android:layout_width="500dp"
    android:layout_height="250dp"
    >

    <android.support.v4.view.ViewPager
        android:id="@+id/vp"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
//你有几张图片就要几个圆点
    <LinearLayout
        android:layout_marginLeft="10dp"
        android:layout_width="match_parent"
        android:layout_height="35dip"
        android:layout_gravity="bottom"
        android:background="#33000000"
        android:gravity="center"
        android:orientation="vertical" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="图片标题"
            android:textColor="@android:color/white"
            android:id="@+id/title_01"
            />

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="3dip"
            android:orientation="horizontal" >

            <View
                android:id="@+id/dot_0"
                android:layout_width="5dip"
                android:layout_height="5dip"
                android:layout_marginLeft="2dip"
                android:layout_marginRight="2dip"
                android:background="@drawable/dot_focused"/>

            <View
                android:id="@+id/dot_1"
                android:layout_width="5dip"
                android:layout_height="5dip"
                android:layout_marginLeft="2dip"
                android:layout_marginRight="2dip"
                android:background="@drawable/dot_normal"/>
            <View
                android:id="@+id/dot_2"
                android:layout_width="5dip"
                android:layout_height="5dip"
                android:layout_marginLeft="2dip"
                android:layout_marginRight="2dip"
                android:background="@drawable/dot_normal"/>
            <View
                android:id="@+id/dot_3"
                android:layout_width="5dip"
                android:layout_height="5dip"
                android:layout_marginLeft="2dip"
                android:layout_marginRight="2dip"
                android:background="@drawable/dot_normal"/>
            <View
                android:id="@+id/dot_4"
                android:layout_width="5dip"
                android:layout_height="5dip"
                android:layout_marginLeft="2dip"
                android:layout_marginRight="2dip"
                android:background="@drawable/dot_normal"/>


            <View
                android:id="@+id/dot_5"
                android:layout_width="5dip"
                android:layout_height="5dip"
                android:layout_marginLeft="2dip"
                android:layout_marginRight="2dip"
                android:background="@drawable/dot_normal"/>
            <View
                android:id="@+id/dot_6"
                android:layout_width="5dip"
                android:layout_height="5dip"
                android:layout_marginLeft="2dip"
                android:layout_marginRight="2dip"
                android:background="@drawable/dot_normal"/>
            <View
                android:id="@+id/dot_7"
                android:layout_width="5dip"
                android:layout_height="5dip"
                android:layout_marginLeft="2dip"
                android:layout_marginRight="2dip"
                android:background="@drawable/dot_normal"/>

        </LinearLayout>

    </LinearLayout>

</FrameLayout>

2.fragment
package com.example.administrator.myapplication;

import android.app.Dialog;
import android.content.Intent;
import android.os.Bundle;
import android.os.Handler;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AlertDialog;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.RadioGroup;
import android.widget.TextView;

import com.example.exam.Exam;

import java.util.ArrayList;
import java.util.List;
import java.util.concurrent.Executors;
import java.util.concurrent.ScheduledExecutorService;
import java.util.concurrent.TimeUnit;

/**
 * Created by Administrator on 2017/6/20.
 */

public class SecondFragment  extends Fragment {

    //存放图片的id
    private int image[]= new int[]{
            R.drawable.ic_action_01,
            R.drawable.ic_action_02,
            R.drawable.ic,
            R.drawable.ic_action_04,
            R.drawable.ic_action_05,
            R.drawable.ic_action_06,
            R.drawable.ic_action_07,
            R.drawable.ic_action_08
    };
    //存放图片的标题
    private  String titles[]={
            "假自我,让我们无法敞开去爱",
            "爱需要安全感","如果你对爱很困惑",
            "你需要自信的恋爱模式",
            "你需要反省自己的爱",
            "世界上最温暖的三个字...",
            "真正爱你的让你,是怎样的",
            "谈恋爱到底在谈什么?"
    };
    private ViewPager viewPager;
    //图片数组
    private List<ImageView> images;
    //圆点数组
    private List<View> dots;
    private TextView textView;

    //实例化真个布局menu下的布局文件
    private MenuInflater menuInflater;

    //记录上一次点的位置
    private int oldPosition = 0;
    private int currentItem;
    private ScheduledExecutorService scheduledExecutorService;
     @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view=inflater.inflate(R.layout.fragment_second,null);
        viewPager = view.findViewById(R.id.vp);
        //显示的图片
        images = new ArrayList<ImageView>();
        for (int i = 0; i < image.length; i++) {
            ImageView imageView=new ImageView(getActivity());
            imageView.setBackgroundResource(image[i]);
            images.add(imageView);
        }
        //显示的小点
        dots = new ArrayList<View>();
        dots.add(view.findViewById(R.id.dot_0));
        dots.add(view.findViewById(R.id.dot_1));
        dots.add(view.findViewById(R.id.dot_2));
        dots.add(view.findViewById(R.id.dot_3));
        dots.add(view.findViewById(R.id.dot_4));
        dots.add(view.findViewById(R.id.dot_5));
        dots.add(view.findViewById(R.id.dot_6));
        dots.add(view.findViewById(R.id.dot_7));

         ViewPagerAdapter adapter=new ViewPagerAdapter();
        viewPager.setAdapter(adapter);

       
        //设置改变监听事件
        viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }

            @Override
            public void onPageSelected(int position) {
                textView.setText(titles[position]);
                dots.get(position).setBackgroundResource(R.drawable.dot_focused);
                dots.get(oldPosition).setBackgroundResource(R.drawable.dot_normal);
                oldPosition = position;
                currentItem = position;
            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });
        return view;
    }

    /**
     * 自定义adapter
     */
       private  class ViewPagerAdapter extends PagerAdapter{

           @Override
           public int getCount() {
               return images.size();
           }

           @Override
           public boolean isViewFromObject(View view, Object object) {
               return view==object;
           }
           @Override
           public void destroyItem(ViewGroup view, int position, Object object) {
               // TODO Auto-generated method stub
//       super.destroyItem(container, position, object);
//       view.removeView(view.getChildAt(position));
//       view.removeViewAt(position);
               view.removeView(images.get(position));
           }

           @Override
           public Object instantiateItem(ViewGroup view, int position) {
               // TODO Auto-generated method stub
               view.addView(images.get(position));
               return images.get(position);
           }

       }

    @Override
    public void onCreateOptionsMenu(Menu menu, MenuInflater inflater) {
//        super.onCreateOptionsMenu(menu, inflater);
        getMenuInflater().inflate(R.menu.main, menu);
    }

    public MenuInflater getMenuInflater()
    {
        return menuInflater;
    }

    /**
     * 利用线程池定时执行动画轮播
     */
    @Override
    public void onStart() {
        // TODO Auto-generated method stub
        super.onStart();
        scheduledExecutorService = Executors.newSingleThreadScheduledExecutor();
        scheduledExecutorService.scheduleWithFixedDelay(
                new ViewPageTask(),
                2,
                2,
                TimeUnit.SECONDS);
    }


    private class ViewPageTask implements Runnable{

        @Override
        public void run() {
            currentItem = (currentItem + 1) % image.length;
            mHandler.sendEmptyMessage(0);
        }

       }
    /**
     * 接收子线程传递过来的数据
     */
    private Handler mHandler = new Handler(){
        public void handleMessage(android.os.Message msg) {
            viewPager.setCurrentItem(currentItem);
        };
    };
    @Override
    public void onStop() {
        // TODO Auto-generated method stub
        super.onStop();
    }

    


}

2.还有两个在drawable文件下的两个布局文件

  
(1)<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <corners android:radius="5dip"/>
    <solid android:color="#55000000"/>
</shape>

(2) <?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval">

    <corners android:radius="5dip"/>
    <solid android:color="#55000000"/>
</shape>


3.一个menu文件夹下
 
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/action_settings"
        android:orderInCategory="100"
        android:title="@string/action_settings"/>
</menu>

4.vaules文件夹下
 
<resources>
    <string name="app_name">尤爱而生</string>
    <string name="action_settings">Settings</string>
</resources>