Android SDK: Anzeigen der Bilder mit einer erweiterten Galerie

Mit Android Intents und der Galerieansicht können Sie dem Benutzer erlauben, Bilder von seinem Gerät auszuwählen. In diesem Tutorial kombinieren wir die Auswahl von Benutzerbildern mit der Galerieansicht, die wir ein wenig verbessern, um eine interaktive Anzeige mit den vom Benutzer ausgewählten Bildern zu erstellen. Wenn Sie mindestens eine Android-Anwendung abgeschlossen haben, sollten Sie in der Lage sein, die Schritte im Tutorial auszuführen.

Die App, die wir in diesem Tutorial erstellen, zeigt mithilfe der Android-Galerieansicht eine Liste mit Miniaturbildern an. Der Benutzer kann Bilder zur Anzeige importieren, indem er lange auf die Elemente in der Galerie drückt, auf denen sie zur Standardanwendung für die Android-Galerie oder zum ausgewählten Dateimanager weitergeleitet werden. Wenn ein ausgewähltes Bild an die App zurückgegeben wird, wird es vor der Anzeige erneut abgetastet, damit keine unnötigen Speicherressourcen verwendet werden. Durch Drücken einer Miniaturansicht zeigt die App das ausgewählte Bild in einer größeren Größe an.

Schritt 1: Erstellen Sie ein Android-Projekt

Starten Sie ein neues Android-Projekt in Eclipse. Fügen Sie in der Hauptaktivitätsklasse Ihrer App oben vor der öffnenden Klassendeklarationszeile die folgenden Importanweisungen hinzu:

1

import android.app.Activity;

2

import android.content.Context;

3

import android.content.Intent;

4

import android.content.res.TypedArray;

5

import android.database.Cursor;

6

import android.graphics.Bitmap;

7

import android.graphics.BitmapFactory;

8

import android.net.Uri;

9

import android.os.Bundle;

10

import android.provider.MediaStore;

11

import android.view.View;

12

import android.view.ViewGroup;

13

import android.widget.AdapterView;

14

import android.widget.AdapterView.OnItemClickListener;

15

import android.widget.AdapterView.OnItemLongClickListener;

16

import android.widget.BaseAdapter;

17

import android.widget.Gallery;

18

import android.widget.ImageView;

Ihre Klassendeklaration sollte ungefähr so ​​beginnen, aber mit Ihrem eigenen Aktivitätsnamen:

1

public class PicSelectActivity extends Activity {

Fügen Sie in der Klassendeklaration vor der "onCreate" -Methode, die Eclipse automatisch hätte einschließen sollen, diese Instanzvariablendeklarationen hinzu:

1

//variable for selection intent

2

private final int PICKER = 1;

3

//variable to store the currently selected image

4

private int currentPic = 0;

5

//gallery object

6

private Gallery picGallery;

7

//image view for larger display

8

private ImageView picView;

Die erste Variable, bei der es sich um eine Konstante handelt, dient zur Identifizierung der Absicht der Bildauswahl, wenn das vom Benutzer ausgewählte Bild an die App zurückgegeben wird. Wenn der Benutzer lange auf ein Miniaturbild drückt und aus der App genommen wird, um ein Bild auszuwählen, verwenden wir die Variable "currentPic", um zu verfolgen, für welches Miniaturbild er ein Bild auswählt. Die beiden anderen Variablen beziehen sich auf Elemente der Benutzeroberfläche, auf die wir in der Klasse verweisen müssen.

In Ihrer Manifestdatei sollten Sie nur Folgendes hinzufügen, das dem Hauptaktivitätselement Ihrer App hinzugefügt wurde:

1

android:configChanges="orientation|keyboardHidden"

Dadurch kann die App importierte Bilder bei Änderungen der Ausrichtung beibehalten. Lassen Sie uns nun die Textzeichenfolgen einrichten, die wir in der Benutzeroberfläche verwenden möchten. Öffnen Sie Ihre Datei "res/values/strings.xml". Eclipse sollte bereits Ihren Anwendungsnamen hinzugefügt haben, den Sie bei Bedarf ändern können. Fügen Sie die folgenden zusätzlichen String-Elemente hinzu:

1

<string name="picture">Picture</string>

2

<string name="select_intro">Long-press a thumbnail to add an image</string>

3

<string name="show_intro">Press a thumbnail to display at larger size</string>

Diese sind alle für die Verwendung innerhalb der Benutzeroberfläche vorgesehen. Kehren Sie jetzt zu Ihrer App-Aktivitätsklasse zurück.

Schritt 2: Entwerfen Sie die App

Bevor wir die App-Funktionalität in Java implementieren, vervollständigen wir die Designelemente. Öffnen Sie Ihre "res/layout/main.xml" Datei. Wir werden ein lineares Layout verwenden. Fügen Sie daher die folgende Gliederung in Ihr Haupt-XML ein:

1

<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"

2

    android:layout_width="fill_parent"

3

    android:layout_height="fill_parent"

4

    android:orientation="vertical" >

5

6

</LinearLayout>

Wir werden weitere Elemente in das lineare Layout einfügen. Beginnen Sie mit einer informativen Textansicht als erstem Element im linearen Layout:

1

<TextView android:layout_width="fill_parent"

2

	android:layout_height="wrap_content"

3

	android:padding="5dp"

4

	android:text="@string/select_intro"

5

	android:gravity="center"

6

	android:textStyle="bold" />

Beachten Sie, dass wir uns auf einen String beziehen, den wir in der XML-Datei für Strings definiert haben. Fügen Sie als Nächstes das Galerieelement wie folgt hinzu:

1

<Gallery

2

	android:id="@+id/gallery"

3

	android:layout_width="fill_parent"

4

	android:layout_height="wrap_content" />

Wir verwenden ein ID-Attribut, damit wir im Java-Code auf die Galerie verweisen können. Fügen Sie als Nächstes eine weitere informative Textansicht hinzu:

1

<TextView android:layout_width="fill_parent"

2

	android:layout_height="wrap_content"

3

	android:gravity="center"

4

	android:padding="5dp"

5

	android:textStyle="italic"

6

	android:text="@string/show_intro" />

Auch hier verwenden wir eine bereits definierte String-Ressource. Schließlich wird das letzte Element in unserem linearen Layout eine Bildansicht zum Anzeigen eines Galeriebilds in größerer Größe sein:

1

<ImageView 

2

	android:id="@+id/picture"

3

	android:layout_width="fill_parent"

4

	android:layout_height="fill_parent"

5

	android:contentDescription="@string/picture" />

Wir müssen in Java auf diese Ansicht verweisen, daher verwenden wir ein ID-Attribut. Wir verwenden auch eine Zeichenfolgenressource als Inhaltsbeschreibung. Jetzt müssen wir einige Stilattribute für die Galerie definieren. Erstellen Sie eine neue Datei in Ihrem Verzeichnis "res/values" und nennen Sie sie "attrs.xml". Geben Sie den folgenden Code ein:

1

<resources>

2

	<declare-styleable name="PicGallery">

3

		<attr name="android:galleryItemBackground" />

4

	</declare-styleable>

5

</resources>

Wir werden einige Ressourcen im Stil der Android-Plattform verwenden, um unsere Galerieelemente zu formatieren, und werden im Java-Code darauf verweisen.

Kehren Sie nun zu Ihrer Aktivitätsklasse zurück. Innerhalb der "onCreate"-Methode sollte Ihr vorhandener Code wie folgt aussehen:

1

super.onCreate(savedInstanceState);

2

setContentView(R.layout.main);

Fügen Sie nach diesen Zeilen Folgendes hinzu und rufen Sie Verweise auf zwei der Elemente der Benutzeroberfläche ab:

1

//get the large image view

2

picView = (ImageView) findViewById(R.id.picture);

3

4

//get the gallery view

5

picGallery = (Gallery) findViewById(R.id.gallery);

Jetzt können wir die Galerie erstellen und die Benutzerinteraktion übernehmen.

Schritt 3: Erstellen Sie einen Basisadapter

Um die Galerieansicht zu erstellen, erstellen wir eine Klasse, die die Basisadapterklasse erweitert. Erstellen Sie in Ihrer Aktivitätsklasse nach der Methode "onCreate" eine neue Gliederung der inneren Klasse wie folgt:

1

public class PicAdapter extends BaseAdapter {

2

3

}

Darin werden einige Methoden bereitgestellt, die vom Basisadapter benötigt werden, und später werden einige benutzerdefinierte Methoden für diese App hinzugefügt. Fügen Sie zunächst in der neuen Klasse einige Instanzvariablen hinzu:

1

//use the default gallery background image

2

int defaultItemBackground;

3

4

//gallery context

5

private Context galleryContext;

6

7

//array to store bitmaps to display

8

private Bitmap[] imageBitmaps;

9

10

//placeholder bitmap for empty spaces in gallery

11

Bitmap placeholder;

Die erste Variable repräsentiert den Hintergrund des Android Gallery-Elements, auf den wir in unserer Datei "attrs.xml" verwiesen haben. Der Kontext bezieht sich beim Hinzufügen von Elementen auf die Benutzeroberfläche. Das Bitmap-Array speichert die Bitmaps, die als Teil der Galerieansicht angezeigt werden sollen. Zunächst verwenden wir ein Platzhalterbild für Galerieelemente, für die der Benutzer noch keine Bilder ausgewählt hat.

Lassen Sie uns nach den Instanzvariablen die Konstruktormethode für unsere neue PicAdapter-Klasse erstellen:

1

public PicAdapter(Context c) {

2

3

	//instantiate context

4

	galleryContext = c;

5

6

	//create bitmap array

7

	imageBitmaps  = new Bitmap[10];

8

9

	//decode the placeholder image

10

	placeholder = BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher);

11

12

	//more processing

13

14

}

Als nächstes werden wir der Konstruktormethode mehr Code hinzufügen. Hier instanziieren wir zuerst die Context- und Bitmap-Array-Variablen - wir werden eine Galerie mit 10 Elementen anzeigen, aber Sie können dies ändern, wenn Sie möchten. Zur Demonstration verwenden wir das standardmäßig bereitgestellte Startsymbol, wenn Sie ein Android-Projekt in Eclipse als Platzhalterbild erstellen. Sie können jedoch auch Ihr eigenes erstellen. Wenn Sie Ihr eigenes Bild verwenden möchten, speichern Sie es in Ihren Zeichenordnern und ändern Sie die Zeile "decodeResource" im obigen Code, um den Namen wiederzugeben.

Jetzt können wir das Platzhalterbild jeder Position im Array zuweisen, sodass es in allen Miniaturansichten der Galerie zunächst angezeigt wird - immer noch innerhalb der Konstruktormethode:

1

//set placeholder as all thumbnail images in the gallery initially

2

for(int i=0; i<imageBitmaps.length; i++)

3

	imageBitmaps[i]=placeholder;

Um die Konstruktormethode zu vervollständigen, legen wir jetzt das Hintergrundbild des Galerieelements fest:

1

//get the styling attributes - use default Andorid system resources

2

TypedArray styleAttrs = galleryContext.obtainStyledAttributes(R.styleable.PicGallery);

3

4

//get the background resource

5

defaultItemBackground = styleAttrs.getResourceId(

6

	R.styleable.PicGallery_android_galleryItemBackground, 0);

7

8

//recycle attributes

9

styleAttrs.recycle();

Hier verweisen wir auf den Inhalt unserer "attrs.xml" Datei.

Jetzt müssen wir einige Standardmethoden für jede Klasse bereitstellen, die die Basisadapterklasse erweitert. Fügen Sie zuerst die "getCount"-Methode nach der Konstruktormethode ein:

1

//return number of data items i.e. bitmap images

2

public int getCount() {

3

	return imageBitmaps.length;

4

}

Diese Methode gibt die Anzahl der Elemente in der Galerieansicht zurück. Fügen Sie nach dieser Methode die Standardmethode "getItem" hinzu:

1

//return item at specified position

2

public Object getItem(int position) {

3

	return position;

4

}

Fügen Sie als nächstes die Methode "getItemId" hinzu:

1

//return item ID at specified position

2

public long getItemId(int position) {

3

	return position;

4

}

Sie müssen sich nicht zu viele Gedanken über den Inhalt dieser Methoden machen, da diese Standard sind. Jetzt fügen wir eine etwas komplexere Methode hinzu, die von der Klasse benötigt wird:

1

//get view specifies layout and display options for each thumbnail in the gallery

2

public View getView(int position, View convertView, ViewGroup parent) {

3

4

	//create the view

5

	ImageView imageView = new ImageView(galleryContext);

6

	//specify the bitmap at this position in the array

7

	imageView.setImageBitmap(imageBitmaps[position]);

8

	//set layout options

9

	imageView.setLayoutParams(new Gallery.LayoutParams(300, 200));

10

	//scale type within view area

11

	imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);

12

	//set default gallery item background

13

	imageView.setBackgroundResource(defaultItemBackground);

14

	//return the view

15

	return imageView;

16

}

In der "getView"-Methode definieren wir, was in jedem Galerieelement angezeigt werden soll. Unser Bitmap-Array enthält die Bilder, die an jeder Position angezeigt werden sollen, wobei der Array-Index einer Bitmap der Position in der Galerie entspricht. Neben dem Erstellen der Ansicht legen wir hier fest, dass die Bitmap zusammen mit einigen Anzeigeeigenschaften darin angezeigt wird. Wir haben auch den Artikelhintergrund festgelegt, auf den wir zuvor Bezug genommen haben. Sie können die Größe der Miniaturansichten ändern, wenn Sie möchten. Jedes Miniaturbild wird zentriert angezeigt, wenn es kleiner als die Elementansicht ist. Sie können das Bild beispielsweise strecken, um es an das Thumnbail anzupassen, indem Sie den "ScaleType" ändern.

Scrollen Sie jetzt zum Anfang der Hauptaktivitätsklassendeklaration Ihrer App. Fügen Sie eine neue Instanzvariable hinzu, die eine Objektinstanz der neuen Klasse darstellt, die Sie gerade erstellt haben:

1

//adapter for gallery view

2

private PicAdapter imgAdapt;

Instanziieren Sie nun in der "onCreate"-Methode nach dem bereits hinzugefügten Code Ihre Basisadaptervariable und legen Sie sie als Adapter für die Galerie fest:

1

//create a new adapter

2

imgAdapt = new PicAdapter(this);

3

4

//set the gallery adapter

5

picGallery.setAdapter(imgAdapt);

Wenn die App zum ersten Mal gestartet wird, sieht sie ungefähr so ​​aus:

Jetzt sind wir bereit für die Benutzerinteraktion.

Schritt 4: Ermöglichen Sie dem Benutzer, Bilder auszuwählen

Um Bilder auszuwählen, die in der Galerie angezeigt werden sollen, muss der Benutzer einzelne Miniaturansichten lange drücken. Fügen Sie in Ihrer "onCreate"-Methode nach dem vorhandenen Code den folgenden Listener für jedes Element in der Galerieansicht hinzu:

1

//set long click listener for each gallery thumbnail item

2

picGallery.setOnItemLongClickListener(new OnItemLongClickListener() {

3

	//handle long clicks

4

	public boolean onItemLongClick(AdapterView<?> parent, View v, int position, long id) {

5

		//take user to choose an image

6

7

	}

8

});

Hier erstellen wir einen neuen "OnItemLongClickListener" mit einer darin enthaltenen "onItemLongClick"-Methode. Fügen Sie innerhalb dieser Methode den folgenden Code hinzu:

1

//update the currently selected position so that we assign the imported bitmap to correct item

2

currentPic = position;

3

4

//take the user to their chosen image selection app (gallery or file manager)

5

Intent pickIntent = new Intent();

6

pickIntent.setType("image/*");

7

pickIntent.setAction(Intent.ACTION_GET_CONTENT);

8

//we will handle the returned data in onActivityResult

9

startActivityForResult(Intent.createChooser(pickIntent, "Select Picture"), PICKER);

10

11

return true;

Nehmen Sie sich einen Moment Zeit, um sich diesen Code anzusehen. Zuerst zeichnen wir das aktuell ausgewählte Element auf, damit wir wissen, für welches Galerieelement ein neues Bild ausgewählt wird. Anschließend weist der Code die App an, Benutzer zu ihrer ausgewählten Bildauswahl-App zu führen, bei der es sich möglicherweise um die Android-Bildergalerie oder eine Dateimanager-Anwendung handelt. Durch Angabe von "ACTION_GET_CONTENT" weisen wir die App an, alles zurückzugeben, was der Benutzer auswählt. Da wir die Auswahlabsicht mit "startActivityForResult" starten, können wir das zurückgegebene Bild in der Aktivitätsmethode "onActivityResult" verarbeiten.

Was passiert, wenn die Bildauswahl Absicht gestartet wird, hängt davon ab, welche Anwendungen der Benutzer installiert hat. Auf meinem Gerät kann ich zwischen zwei Apps für die Bildauswahl wählen:

Welche Bilddatei ich in einer dieser Anwendungen auswähle, wird an unsere App zurückgegeben.

Schritt 5: Zurückgegebene Bilder verarbeiten

Wenn der Benutzer ein Bild aus seiner Galerie- oder Dateimanager-App auswählt, werden die Daten an die Methode "onActivityResult" zurückgegeben. Fügen Sie die Methode Ihrer Aktivitätsklasse mithilfe der folgenden Gliederung hinzu:

1

protected void onActivityResult(int requestCode, int resultCode, Intent data) {

2

3

}

4

/java]

5

6

Inside the method, add the following:

7

8

[java]

9

if (resultCode == RESULT_OK) {

10

	//check if we are returning from picture selection

11

	if (requestCode == PICKER) {

12

            //import the image

13

14

	}

15

}

16

//superclass method

17

super.onActivityResult(requestCode, resultCode, data);

Hier überprüfen wir, ob wir gültige Daten erhalten haben und ob die Daten von der Bildauswahl Intent zurückgegeben wurden. Wir rufen die Superclass-Methode am Ende des Methodenkörpers auf. In der zweiten "if"-Anweisung fügen wir den gesamten Code hinzu, den wir zum Importieren des vom Benutzer ausgewählten Bildes benötigen, beginnend mit dem Bild-URI:

1

//the returned picture URI

2

Uri pickedUri = data.getData();

Wir müssen etwas mehr arbeiten, um das Bild zu importieren. Beginnen Sie mit der Deklaration einiger Hilfsvariablen:

1

//declare the bitmap

2

Bitmap pic = null;

3

4

//declare the path string

5

String imgPath = "";

Versuchen wir nun, den Bildpfad abzurufen:

1

//retrieve the string using media data

2

String[] medData = { MediaStore.Images.Media.DATA };

3

//query the data

4

Cursor picCursor = managedQuery(pickedUri, medData, null, null, null);

5

if(picCursor!=null)

6

{

7

	//get the path string

8

	int index = picCursor.getColumnIndexOrThrow(MediaStore.Images.Media.DATA);

9

	picCursor.moveToFirst();

10

	imgPath = picCursor.getString(index);

11

}

12

else

13

	imgPath = pickedUri.getPath();

Hier rufen wir die Bildmediendaten ab, fragen sie dann mit einem Cursor ab und übergeben den URI für das vom Benutzer ausgewählte Bild. Die Anweisungen "if" und "else" ermöglichen es dem Benutzer, sein Bild entweder über die Android-Galerie-App oder einen anderen Dateimanager auszuwählen. Das Endergebnis dieses Codes ist, dass wir den Pfad zum ausgewählten Bild haben.

Schritt 6: Zeigen Sie abgetastete Bilder an, um die Speichernutzung zu minimieren

Anstatt nur das vom Benutzer ausgewählte Bild einzulesen, müssen wir den Speicherbedarf unserer App minimieren. In vielen Fällen sind die Bilder auf dem Gerät viel größer als das, was wir in der App anzeigen können. Aus diesem Grund möchten wir jedes Bild neu abtasten, bevor wir es in die App einlesen. Fügen Sie noch in der zweiten "if"-Anweisung in "onActivityResult" Folgendes hinzu:

1

//if we have a new URI attempt to decode the image bitmap

2

if(pickedUri!=null) {

3

4

}

In dieser Anweisung werden wir das Bild erneut abtasten und importieren. Geben Sie zunächst die Zielbreite und -höhe für Ihre Bilder an. Das sollte die größte Größe sein, die für jedes Bild angezeigt werden soll:

1

//set the width and height we want to use as maximum display

2

int targetWidth = 600;

3

int targetHeight = 400;

Jetzt benötigen wir ein Bitmap Options-Objekt, um das Bild zu dekodieren:

1

//create bitmap options to calculate and use sample size

2

BitmapFactory.Options bmpOptions = new BitmapFactory.Options();

Zuerst wollen wir die Größe des Bildes herausfinden:

1

//first decode image dimensions only - not the image bitmap itself

2

bmpOptions.inJustDecodeBounds = true;

3

BitmapFactory.decodeFile(imgPath, bmpOptions);

4

5

//image width and height before sampling

6

int currHeight = bmpOptions.outHeight;

7

int currWidth = bmpOptions.outWidth;

Wir weisen die Bitmap-Optionen an, die Abmessungen des Bildes zu dekodieren, nicht die Bitmap selbst. Wir werden diese Informationen verwenden, um eine gute Stichprobengröße für den Import des Bildes zu ermitteln. Beginnen Sie mit der Initialisierung einer Variablen zum Speichern:

1

//variable to store new sample size

2

int sampleSize = 1;

Berechnen Sie nun die Stichprobengröße, wenn die Zielgröße kleiner als die Standardgröße des Bildes ist:

1

//calculate the sample size if the existing size is larger than target size

2

if (currHeight>targetHeight || currWidth>targetWidth) 

3

{

4

	//use either width or height

5

	if (currWidth>currHeight)

6

		sampleSize = Math.round((float)currHeight/(float)targetHeight);

7

	else 

8

		sampleSize = Math.round((float)currWidth/(float)targetWidth);

9

}

Jetzt können wir die Bitmap-Stichprobengröße einstellen:

1

//use the new sample size

2

bmpOptions.inSampleSize = sampleSize;

Jetzt müssen wir die Einstellungen für die Bitmap-Optionen ändern, um den Dateiinhalt selbst und nicht nur seine Abmessungen zu dekodieren:

1

//now decode the bitmap using sample options

2

bmpOptions.inJustDecodeBounds = false;

Schließlich können wir die Bitmap mit den von uns gewählten Optionen dekodieren:

1

//get the file as a bitmap

2

pic = BitmapFactory.decodeFile(imgPath, bmpOptions);

Die Variable "pic" enthält jetzt das Bitmap-Bild, das wir in der App verwenden möchten.

Schritt 7: Fügen Sie der Galerie ausgewählte Bilder hinzu

Nachdem wir das vom Benutzer ausgewählte Bild importiert haben, können wir es dem Galerie-Array hinzufügen. Dazu müssen wir unserer Basisadapterklasse eine benutzerdefinierte Methode hinzufügen. Fügen Sie in Ihrer inneren Klassendeklaration "PicAdapter" nach der Methode "getView" die folgende Methode hinzu:

1

//helper method to add a bitmap to the gallery when the user chooses one

2

public void addPic(Bitmap newPic)

3

{

4

	//set at currently selected index

5

	imageBitmaps[currentPic] = newPic;

6

}

Kehren Sie nun zu Ihrer Methode "onActivityResult" zurück. Fügen Sie nach der Zeile, in der Sie die Bilddatei dekodiert und in der Variablen "pic" gespeichert haben, Folgendes hinzu:

1

//pass bitmap to ImageAdapter to add to array

2

imgAdapt.addPic(pic);

3

//redraw the gallery thumbnails to reflect the new addition

4

picGallery.setAdapter(imgAdapt);

Zuerst rufen wir die neue Methode auf, um dem Galerie-Array ein neues Bild hinzuzufügen, und stellen dann den Adapter erneut ein, damit das neue Bild sofort in der Galerieansicht angezeigt wird.

Schritt 8: Zeigen Sie ein Bild in größerer Größe an

Schließlich möchten wir ein Bild in größerer Größe anzeigen. Ein Bild wird in der größeren Bildansicht angezeigt, wenn es zum ersten Mal in die App importiert wird und wenn der Benutzer es aus den Miniaturansichten der Galerie auswählt. Lassen Sie uns zunächst ein Bild in größerer Größe anzeigen, wenn der Benutzer es zum ersten Mal importiert. Fügen Sie in Ihrer "onActivityResult"-Methode nach der Zeile, in der Sie "setAdapter" aufgerufen haben, Folgendes hinzu:

1

//display the newly selected image at larger size

2

picView.setImageBitmap(pic);

3

//scale options

4

picView.setScaleType(ImageView.ScaleType.FIT_CENTER);

Wir haben eine Instanzvariable, die die größere Bildansicht darstellt, sodass sie einfach zusammen mit Skalierungsoptionen festgelegt werden kann. Lassen Sie uns nun das größere Bild anzeigen, wenn der Benutzer auf eine Miniaturansicht klickt. Fügen Sie in Ihrer "PicAdapter"-Klasse nach der "addPic"-Methode eine weitere benutzerdefinierte Methode hinzu:

1

//return bitmap at specified position for larger display

2

public Bitmap getPic(int posn)

3

{

4

	//return bitmap at posn index

5

	return imageBitmaps[posn];

6

}

Diese Methode gibt das Bild einfach an der angegebenen Position zurück. Gehen Sie nun zu Ihrer Aktivitätsmethode "onCreate". Fügen Sie nach dem von Ihnen hinzugefügten Listener für langes Drücken Folgendes hinzu und implementieren Sie einen Klick-Listener für jedes Element in der Galerieansicht:

1

//set the click listener for each item in the thumbnail gallery

2

picGallery.setOnItemClickListener(new OnItemClickListener() {

3

	//handle clicks

4

	public void onItemClick(AdapterView<?> parent, View v, int position, long id) {

5

		//set the larger image view to display the chosen bitmap calling method of adapter class

6

		picView.setImageBitmap(imgAdapt.getPic(position));

7

	}

8

});

Die Methode "onItemClick" wird jedes Mal ausgelöst, wenn der Benutzer auf ein Element in der Galerie klickt. Wir rufen die neue "getPic"-Methode auf, die wir der "PicAdapter"-Klasse hinzugefügt haben, um die Bitmap an der angeklickten Position zurückzugeben, und legen diese als Bildansichts-Bitmap fest, um sie in größerer Größe anzuzeigen.

Schlussfolgerung

Das ist unsere Bildergalerie App komplett. Testen Sie es auf einem tatsächlichen Gerät, importieren Sie Bilder, indem Sie lange auf Miniaturansichten drücken, und drücken Sie nacheinander auf jedes Miniaturbild, um es in größerer Größe anzuzeigen. Wenn der Benutzer einige Bilder ausgewählt hat, wird die App folgendermaßen angezeigt:

Sie können die Anwendung natürlich an Ihre eigenen Bedürfnisse anpassen, um beispielsweise zusätzliche Bildinteraktionen bereitzustellen. Der Quellcode dient als Referenz, sodass Sie sicherstellen können, dass alle Elemente korrekt kombiniert sind.