【Android】ViewPagerが画像左右をスライドさせて再生し、クリックイベントを追加
12056 ワード
先日先生は私にAndroidのdemoを書いてもらいました.一つの画像を左右にスライドさせる効果を実現し、画像をクリックすると音がします.
Androidを久しぶりに書いたので、復習や勉強に時間がかかりました.次に、プロセスと実装の簡単な記録を以下に示す.(項目はCSDNブロガーAndroid将軍の一部参照)
実装はViewPager
コードは、リスニングをクリックした部分で、List<>のコントロールを取得してタッチリスニングを追加します.もちろん、各ページに複数のコントロールを追加し、インタフェースのコントロールを取得し、それぞれリスニングを追加することができます.
そしてコードには最適化の場所があります...でもプレゼンテーションのためだけに、あまり時間がかかりませんでした..私の無責任を許してください...
レイアウトファイル:
ページレイアウトファイル:
上のページレイアウトファイルにImageViewを追加して画面全体を埋めただけです.もちろん、ここに文字や他のコントロールを追加する必要がある場合は、リスニングを追加するには、取得して上記のように追加するだけです.
自動スライドが必要な場合は、タイマーを追加するか、これを完了することができます.
他のアニメーションの切り替え効果は、これらの拡張がどのように実現されたかによって決まります.
しかし、ViewPagerの柔軟性は高くないと感じて、完全に自分でカスタマイズして、もっと多くのインタフェースと柔軟性の選択を持つ空間を実現することができます.もちろんこれは需要次第です.
OK、ここに記録します.
Androidを久しぶりに書いたので、復習や勉強に時間がかかりました.次に、プロセスと実装の簡単な記録を以下に示す.(項目はCSDNブロガーAndroid将軍の一部参照)
実装はViewPager
コードは、リスニングをクリックした部分で、List<>のコントロールを取得してタッチリスニングを追加します.もちろん、各ページに複数のコントロールを追加し、インタフェースのコントロールを取得し、それぞれリスニングを追加することができます.
そしてコードには最適化の場所があります...でもプレゼンテーションのためだけに、あまり時間がかかりませんでした..私の無責任を許してください...
package com.example.viewpagerdemo;
import java.util.ArrayList;
import android.media.MediaPlayer;
import android.os.Bundle;
import android.os.Parcelable;
import android.app.Activity;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.view.ViewGroup.LayoutParams;
import android.widget.ImageView;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
public class TwoActivity extends Activity implements OnPageChangeListener {
private ViewPager viewPager;
private ArrayList<View> list;
private ImageView imageView;
private ImageView[] imageViews;
private MediaPlayer mediaPlayer = null;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
LayoutInflater inflater = getLayoutInflater();
list = new ArrayList<View>();
list.add(inflater.inflate(R.layout.item01, null));
list.add(inflater.inflate(R.layout.item02, null));
list.add(inflater.inflate(R.layout.item03, null));
list.add(inflater.inflate(R.layout.item04, null));
list.add(inflater.inflate(R.layout.item05, null));
imageViews = new ImageView[list.size()];
ViewGroup group = (ViewGroup)findViewById(R.id.viewGroup);
viewPager = (ViewPager)findViewById(R.id.viewPager);
for(int i=0; i<list.size(); i++){
imageView = new ImageView(this);
imageView.setLayoutParams(new LayoutParams(12,12));
imageViews[i] = imageView;
if(i == 0){
imageView.setBackgroundResource(R.drawable.page_indicator_focused);
}else{
imageView.setBackgroundResource(R.drawable.page_indicator_unfocused);
}
group.addView(imageView);
}
viewPager.setAdapter(new MyAdapter());
viewPager.setOnPageChangeListener(this);
viewPager.setCurrentItem(0);
}
@Override
public void onPageScrollStateChanged(int arg0) {
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
}
@Override
public void onPageSelected(int arg0) {
Log.e("log", " " + arg0%list.size());
// null，
if(mediaPlayer!=null)
{
if (mediaPlayer.isPlaying())
{
mediaPlayer.stop();
mediaPlayer = null;
}
}
setImageBackground(arg0%list.size());
}
private void setImageBackground( int selectItems){
for(int i=0; i<imageViews.length; i++){
if(i == selectItems){
imageViews[i].setBackgroundResource(R.drawable.page_indicator_focused);
}else{
imageViews[i].setBackgroundResource(R.drawable.page_indicator_unfocused);
}
}
}
public class MyAdapter extends PagerAdapter{
@Override
public int getCount() {
return Integer.MAX_VALUE;
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0 == arg1;
}
@Override
public int getItemPosition(Object object) {
return super.getItemPosition(object);
}
@Override
public Object instantiateItem(ViewGroup container, final int position) {
// ， ，
switch (position)
{
case 0:
list.get(0).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Log.e("log", " dog ");
if(mediaPlayer!=null)
{
if (mediaPlayer.isPlaying())
{
mediaPlayer.stop();
mediaPlayer = null;
}
}
initMediaPlayer(0);
mediaPlayer.start();
}
});
break;
case 1:
list.get(1).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Log.e("log", " cat ");
if(mediaPlayer!=null)
{
if (mediaPlayer.isPlaying())
{
mediaPlayer.stop();
mediaPlayer = null;
}
}
initMediaPlayer(1);
mediaPlayer.start();
}
});
break;
case 2:
list.get(2).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Log.e("log", " cat ");
if(mediaPlayer!=null)
{
if (mediaPlayer.isPlaying())
{
mediaPlayer.stop();
mediaPlayer = null;
}
}
initMediaPlayer(2);
mediaPlayer.start();
}
});
break;
case 3:
list.get(3).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Log.e("log", " cat ");
if(mediaPlayer!=null)
{
if (mediaPlayer.isPlaying())
{
mediaPlayer.stop();
mediaPlayer = null;
}
}
initMediaPlayer(3);
mediaPlayer.start();
}
});
break;
case 4:
list.get(4).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Log.e("log", " cat ");
if(mediaPlayer!=null)
{
if (mediaPlayer.isPlaying())
{
mediaPlayer.stop();
mediaPlayer = null;
}
}
initMediaPlayer(4);
mediaPlayer.start();
}
});
break;
default:
break;
}
((ViewPager) container).addView(list.get(position%list.size()),0);
return list.get(position%list.size());
}
@Override
public void restoreState(Parcelable arg0, ClassLoader arg1) {
}
@Override
public Parcelable saveState() {
return null;
}
@Override
public void startUpdate(View arg0) {
}
@Override
public void finishUpdate(View arg0) {
}
@Override
public void destroyItem(View container, int position, Object object) {
((ViewPager)container).removeView(list.get(position%list.size()));
}
}
private void initMediaPlayer(int i){
//
try {
switch (i)
{
case 0:
mediaPlayer = MediaPlayer.create(this, R.raw.bgm1);
mediaPlayer.prepare();
break;
case 1:
mediaPlayer = MediaPlayer.create(this, R.raw.bgm2);
mediaPlayer.prepare();
break;
case 2:
mediaPlayer = MediaPlayer.create(this, R.raw.bgm3);
mediaPlayer.prepare();
break;
case 3:
mediaPlayer = MediaPlayer.create(this, R.raw.bgm4);
mediaPlayer.prepare();
break;
case 4:
mediaPlayer = MediaPlayer.create(this, R.raw.bgm5);
mediaPlayer.prepare();
break;
default:
break;
}
} catch (Exception e)
{
e.printStackTrace();
}
}
}
レイアウトファイル:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:id="@+id/viewGroup"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="30dp"
android:gravity="center_horizontal"
android:orientation="horizontal" >
</LinearLayout>
</RelativeLayout>
</FrameLayout>ページレイアウトファイル:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:id="@+id/imageView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="centerCrop"
android:src="@drawable/dog" />
</LinearLayout>上のページレイアウトファイルにImageViewを追加して画面全体を埋めただけです.もちろん、ここに文字や他のコントロールを追加する必要がある場合は、リスニングを追加するには、取得して上記のように追加するだけです.
自動スライドが必要な場合は、タイマーを追加するか、これを完了することができます.
他のアニメーションの切り替え効果は、これらの拡張がどのように実現されたかによって決まります.
しかし、ViewPagerの柔軟性は高くないと感じて、完全に自分でカスタマイズして、もっと多くのインタフェースと柔軟性の選択を持つ空間を実現することができます.もちろんこれは需要次第です.
OK、ここに記録します.