画像をスライドショーとして表示する。完成:ファイル一式。

画像をギャラリー形式での表示を行います。

何度か、「画像をスライドショーとして表示をする。」として、行ってきました。

下記の形でスライドショーを完成できました!

 

ゼロからのAndroidアプリケーション開発入門

を参考に改良したものを作成させていただいております。

 

レイアウトとしては、下記のような、形で、上にサムネイル。下に表示領域を用意する。

gallery

 

最初にmain.xmlは下記のような形になります。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:orientation="vertical"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 >
 <Gallery 
 android:layout_height="wrap_content" 
 android:id="@+id/gallery1" 
 android:layout_width="fill_parent"></Gallery>
 <ImageView 
 android:layout_height="fill_parent" 
 android:src="@drawable/icon" 
 android:id="@+id/imageView1" 
 android:layout_width="fill_parent"></ImageView>
</LinearLayout>

レイアウトはlinearLayoutを用いて、Galleryは高さがwrap_contentで、ImageViewの方はfill_parentとして、イメージの部分を使いやすいようにしておく。

SlideGallery.javaは下記のようになる。

package in.andante.slide;

import java.io.File;
import java.util.ArrayList;
import java.util.List;

import android.app.Activity;
import android.app.AlertDialog;
import android.app.ProgressDialog;
import android.content.DialogInterface;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.os.Bundle;
import android.os.Environment;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.Gallery;
import android.widget.ImageView;
import android.widget.AdapterView.OnItemClickListener;

public class SlideGallery extends Activity implements DialogInterface.OnClickListener,OnItemClickListener,Runnable{
 /** Called when the activity is first created. */

 private ProgressDialog dialog;
 private ImageView imageView;
 private Gallery gallery;
 private Bitmap[] thumbnail;
 private List<String> dirList = new ArrayList<String>();
 private List<String> tmp = new ArrayList<String>();
 @Override
 public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.main);

 if(!sdcardReadReady()){
 new AlertDialog.Builder(this)
 .setMessage("SDカードにアクセスできません。")
 .setNeutralButton("OK", this)
 .show();
 return;
 }
 dirList.add(Environment.getExternalStorageDirectory().getPath());
 int i = 0;
 int j = 0;
 while(dirList.size() > i){  
 File subDir = new File(dirList.get(i));  
 String subFileName[] = subDir.list();
 j = 0;
 if(subFileName != null){
 while(subFileName.length > j){  
 File subFile = new File(subDir.getPath() + "/" + subFileName[j]);  
 if(subFile.isDirectory()){
 String _st =subDir.getPath() + "/" + subFileName[j]; 
 dirList.add(_st);
 }else if(subFile.getName().endsWith("jpg") || subFile.getName().endsWith("JPG")){  
 tmp.add(subDir.getPath() + "/" + subFileName[j]);  
 }  
 j++;
 }
 }
 i++;  
 }

 if(tmp.isEmpty()){
 new AlertDialog.Builder(this)
 .setMessage("画像のデータがありません")
 .setNeutralButton("OK", this)
 .show();
 return;
 }

 //tmp.toArray();
 dialog = new ProgressDialog(this);
 dialog.setMessage("読み込みを行います。");
 dialog.show();
 thumbnail = new Bitmap[tmp.size()];
 new Thread(this).start();
 gallery = (Gallery)findViewById(R.id.gallery1);
 gallery.setSpacing(8);
 gallery.setAdapter(new GalleryAdapter());
 gallery.setOnItemClickListener(this);
 imageView = (ImageView)findViewById(R.id.imageView1);
 Bitmap picture = BitmapFactory.decodeFile(tmp.get(0));
 imageView.setImageBitmap(picture);
 }

 public void run(){
 for(int i = 0 ; i < tmp.size(); i++){
 BitmapFactory.Options options = new BitmapFactory.Options();
 options.inJustDecodeBounds = true;
 BitmapFactory.decodeFile(tmp.get(i),options);
 int height = options.outHeight;
 int scale = height /50;
 options.inSampleSize = scale;
 options.inJustDecodeBounds = false;
 thumbnail[i] = BitmapFactory.decodeFile(tmp.get(i),options);
 }
 dialog.dismiss();
 }

 private boolean sdcardReadReady(){
 String state = Environment.getExternalStorageState();
 return (Environment.MEDIA_MOUNTED.equals(state)||Environment.MEDIA_MOUNTED_READ_ONLY.equals(state));
 }

 @Override
 public void onClick(DialogInterface dialog, int which) {
 switch(which){
 case DialogInterface.BUTTON_NEUTRAL:
 dialog.dismiss();
 finish();
 }
 }

 @Override
 public void onItemClick(AdapterView<?> arg0, View arg1, int arg2, long arg3) {
 // TODO Auto-generated method stub
 if(arg0 == gallery){
 Bitmap picture = BitmapFactory.decodeFile(
 tmp.get(arg2)    
 );
 imageView.setImageBitmap(picture);
 }
 }
 public class GalleryAdapter extends BaseAdapter{

 @Override
 public int getCount() {
 // TODO Auto-generated method stub
 return tmp.size();
 }

 @Override
 public Object getItem(int position) {
 // TODO Auto-generated method stub
 return null;
 }

 @Override
 public long getItemId(int position) {
 // TODO Auto-generated method stub
 return 0;
 }

 @Override
 public View getView(int position, View convertView, ViewGroup parent) {
 // TODO Auto-generated method stub
 ImageView view;
 if(convertView == null){
 view = new ImageView(SlideGallery.this);
 view.setImageBitmap(thumbnail[position]);
 }else{
 view = (ImageView)convertView;
 }
 return view;
 }
 }
}

以上で簡単にではありますが、SDcardの中のスライドショーが完成しました。

前後の記事

前の記事:

次の記事:

関連の記事

コメント

:D 頭ポン

参考にしました。ありがとうございます。

:D akari

とても参考になります。
記事の作成日付がないので今でも更新されているのかどうかよく分かりませんが、ひとつ教えて頂きたいことがあります。

サムネイル画像をthumbnail[]にセットする部分を別スレッドで動かしていると思いますが、処理が重たい(画像データが多い・大きい)と、メインのスレッドのほうのギャラリー描画(gallery.setAdapter())がうまくいかなくなる、ような気がします。どうでしょうか?

:D akari

どうやらAVDのほうが悪かったようです。
新規にAVDを作成して動かしてみたら画像データ量にかかわらず正常に動きました。お騒がせいたしました。

:D こまち

はじめまして。わかりやすく参考になります。ありがとうございます。

教えてほしいことがあります。

drawableに入っている画像をViewPagerでスワイプできるようにしました。
スワイプと連動して、現在表示ページを表す
iPhone のPageContolのような点々をつくりたいのです。

なんという名称なのかもわからないので、検索も出来ず、困り果てております。
お忙しいところ恐縮です、ご指導お願いします。

コメントの投稿

  • サイト内検索

新作アプリの紹介

関連サイトの紹介

アンドロイドアプリ開発TIPS
きぐるみカメラ
ふらいぱん
アンドロイドのデザイン集
Page top↑