The fourth assignment-baby photo album
Title
Use Listview to create a baby photo album. The content and pictures of the photo album can be set by yourself or obtained from the data file. Provides screenshots of the simulator simulation interface and code. (Reference Example 4-8)
Create project
Create a project named baby. The final project directory structure is as shown below:
i1, i2, i3, i4, i5, and i6 in the res/drawable file are all pictures, that is, baby album pictures. You can just select the photos online.
res/layout is a file layout file, activity_main.xml is an automatically generated custom layout file, and list_item.xml is a custom layout file
Layout file
-
Create a custom layout file
list_item.xmlfile<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="horizontal"> <ImageView android:id="@ + id/news_thumb" android:layout_width="100dp" android:layout_height="100dp" android:layout_margin="5dp"/> <LinearLayout android:orientation="vertical" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="5dp"> <TextView android:id="@ + id/news_title" android:layout_width="match_parent" android:layout_height="wrap_content" android:textSize="16sp" /> <TextView android:id="@ + id/news_info" android:layout_width="match_parent" android:layout_height="wrap_content" android:textSize="14sp" android:layout_marginTop="5dp"/> </LinearLayout> </LinearLayout>
-
Modify the MainActivity.xml layout file
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingLeft="16dp" android:paddingRight="16dp"> <ListView android:id="@ + id/list" android:layout_width="match_parent" android:layout_height="match_parent"/> </RelativeLayout>
MainActivity file
package com.example.baby;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ListView;
import android.widget.SimpleAdapter;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import java.util.Random;
public class MainActivity extends AppCompatActivity {<!-- -->
private ListView listView;
private SimpleAdapter adapter;
@Override
protected void onCreate(Bundle savedInstanceState) {<!-- -->
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Assume there is a List containing data
List<Map<String, String>> data = new ArrayList<>();
Map<String, String> item1 = new HashMap<>();
item1.put("news_thumb", String.valueOf(R.drawable.i1)); //R.drawable.i1 refers to the photo resource file
item1.put("news_title", "Felt Hat Series");
item1.put("news_info", "This series of clothing is a bit cute, not like a coachman.");
data.add(item1);
Map<String, String> item2 = new HashMap<>();
item2.put("news_thumb", String.valueOf(R.drawable.i2)); //R.drawable.i2 refers to the photo resource file
item2.put("news_title", "Snail Series");
item2.put("news_info", "The baby turned into a little snail, crawling and crawling.");
data.add(item2);
Map<String, String> item3 = new HashMap<>();
item3.put("news_thumb", String.valueOf(R.drawable.i3));
item3.put("news_title", "Little Bee Series");
item3.put("news_info", "Little bees, buzzing, flying to the west, flying to the east.");
data.add(item3);
Map<String, String> item4 = new HashMap<>();
item4.put("news_thumb", String.valueOf(R.drawable.i4));
item4.put("news_title", "Felt Hat Series");
item4.put("news_info", "This series of clothing is a bit cute, not like a coachman.");
data.add(item4);
Map<String, String> item5 = new HashMap<>();
item5.put("news_thumb", String.valueOf(R.drawable.i5));
item5.put("news_title", "Snail Series");
item5.put("news_info", "The baby turned into a little snail, crawling and crawling.");
data.add(item5);
Map<String, String> item6 = new HashMap<>();
item6.put("news_thumb", String.valueOf(R.drawable.i6));
item6.put("news_title", "Little Bee Series");
item6.put("news_info", "Little bees, buzzing, flying to the west, flying to the east.");
data.add(item6);
// Define the mapping between data keys and components in the layout file
String[] from = {<!-- -->"news_thumb", "news_title", "news_info"};
int[] to = {<!-- -->R.id.news_thumb, R.id.news_title, R.id.news_info};
//Create SimpleAdapter
adapter = new SimpleAdapter(this, data, R.layout.list_item, from, to);
//Associate SimpleAdapter and ListView
listView = findViewById(R.id.list);
listView.setAdapter(adapter);
//Add an item click listener to the ListView and display the dialog box when the item is clicked
listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {<!-- -->
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {<!-- -->
// Get the data of the clicked item
Map<String, String> itemData = (Map<String, String>) parent.getItemAtPosition(position);
// Extract text information from the data of the clicked item for use in the dialog box
String title = itemData.get("news_title");
String info = itemData.get("news_info");
//Create and display a custom dialog box
AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
builder.setTitle(title)
.setMessage(info)
.setPositiveButton("OK", null); // OK button without operation
AlertDialog dialog = builder.create();
dialog.show();
}
});
}
}
Modify the AndroidManifest.xml file
<activity
android:name=".MainActivity"
android:exported="true"
android:label="SimpleAdapterDemo"> <!--Modify the navigation bar name-->
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
Effect display
