Computer >> คอมพิวเตอร์ >  >> การเขียนโปรแกรม >> Android

จะแสดงรายการรูปภาพและข้อความใน ListView ใน Android ได้อย่างไร


ก่อนเข้าสู่ตัวอย่าง listview เราควรทราบเกี่ยวกับ listview, Listview คือชุดของรายการที่ดึงมาจาก arraylist, list หรือฐานข้อมูลใดๆ การใช้งาน listview ส่วนใหญ่เป็นการรวบรวมรายการในรูปแบบแนวตั้ง เราสามารถเลื่อนขึ้น/ลงและคลิกที่รายการใดก็ได้

มุมมองรายการที่กำหนดเองคืออะไร

Listview แบบกำหนดเองทำงานตาม customAdapter ในอะแด็ปเตอร์แบบกำหนดเองนี้ เราสามารถส่งต่ออ็อบเจกต์แบบกำหนดเองได้ เรากำลังส่งข้อมูลเรื่องไปยัง listview ดังแสดงด้านล่าง

ขั้นตอนที่ 1 − สร้างโครงการใหม่ใน Android Studio ไปที่ไฟล์ ⇒ โครงการใหม่และกรอกรายละเอียดที่จำเป็นทั้งหมดเพื่อสร้างโครงการใหม่

ขั้นตอนที่ 2 − เพิ่มรหัสต่อไปนี้ใน res/layout/activity_main.xml

 

ใน activity_main.xml ด้านบน เราได้ประกาศ listview และเพิ่มตัวแบ่งตามที่แสดงด้านล่าง

ขั้นตอนที่ 3 − เพิ่มรหัสต่อไปนี้ใน src/MainActivity.java

<ก่อนหน้า>นำเข้า android.os.Bundle;นำเข้า android.support.v7.app.AppCompatActivity นำเข้า android.widget.ListView นำเข้า java.util.ArrayList คลาสสาธารณะ MainActivity ขยาย AppCompatActivity { @Override ป้องกันเป็นโมฆะ onCreate (Bundle saveInstanceState) { super.onCreate (savedInstanceState); setContentView(R.layout.activity_main); รายการ ListView สุดท้าย =findViewById(R.id.list); ArrayList arrayList =ใหม่ ArrayList(); arrayList.add(ใหม่ SubjectData("JAVA", "https://www.tutorialspoint.com/java/", "https://www.tutorialspoint.com/java/images/java-mini-logo.jpg") ); arrayList.add(ใหม่ SubjectData("Python", "https://www.tutorialspoint.com/python/", "https://www.tutorialspoint.com/python/images/python-mini.jpg")); arrayList.add(ใหม่ SubjectData("Javascript", "https://www.tutorialspoint.com/javascript/", "https://www.tutorialspoint.com/javascript/images/javascript-mini-logo.jpg") ); arrayList.add(ใหม่ SubjectData("Cprogramming", "https://www.tutorialspoint.com/cprogramming/", "https://www.tutorialspoint.com/cprogramming/images/c-mini-logo.jpg") ); arrayList.add(ใหม่ SubjectData("Cplusplus", "https://www.tutorialspoint.com/cplusplus/", "https://www.tutorialspoint.com/cplusplus/images/cpp-mini-logo.jpg") ); arrayList.add(ใหม่ SubjectData("Android", "https://www.tutorialspoint.com/android/", "https://www.tutorialspoint.com/android/images/android-mini-logo.jpg") ); CustomAdapter customAdapter =CustomAdapter ใหม่ (นี่ arrayList); list.setAdapter (กำหนดเองอะแดปเตอร์); }}

ใน mainActivity เราได้ประกาศ CustomAdapter และส่ง SubjectData ดังที่แสดงด้านล่าง

CustomAdapter customAdapter =CustomAdapter ใหม่ (นี่, arrayList);list.setAdapter (customAdapter);

ขั้นตอนที่ 4 − สร้างคลาส CustomAdapter เพิ่มรหัสต่อไปนี้ใน src/ CustomAdapter.java

นำเข้า android.content.Context;นำเข้า android.database.DataSetObserver;นำเข้า android.view.LayoutInflater;นำเข้า android.view.View;นำเข้า android.view.ViewGroup;นำเข้า android.widget.ImageView;นำเข้า android.widget ListAdapter นำเข้า android.widget.TextView นำเข้า com.squareup.picasso.Picasso นำเข้า java.util.ArrayList คลาส CustomAdapter ใช้ ListAdapter { ArrayList arrayList; บริบทบริบท CustomAdapter สาธารณะ (บริบทบริบท ArrayList  arrayList) { this.arrayList=arrayList; this.context=บริบท; } @Override บูลีนสาธารณะ areAllItemsEnabled () { คืนค่าเท็จ; } @แทนที่บูลีนสาธารณะ isEnabled (ตำแหน่ง int) { คืนค่าจริง; } @Override โมฆะสาธารณะ registerDataSetObserver (ผู้สังเกตการณ์ DataSetObserver) { } @Override โมฆะสาธารณะ unregisterDataSetObserver (ผู้สังเกตการณ์ DataSetObserver) { } @Override int สาธารณะ getCount () { return arrayList.size (); } @Override วัตถุสาธารณะ getItem (ตำแหน่ง int) { ตำแหน่งกลับ; } @Override สาธารณะ long getItemId (ตำแหน่ง int) { ตำแหน่งกลับ; } @Override บูลีนสาธารณะ hasStableIds () { คืนค่าเท็จ; } @Override สาธารณะ ดู getView (ตำแหน่ง int, ดู convertView, พาเรนต์ ViewGroup) { SubjectData subjectData =arrayList.get (ตำแหน่ง); ถ้า (convertView ==null) { LayoutInflater layoutInflater =LayoutInflater.from (บริบท); ConvertView =LayoutInflater.inflate (R.layout.list_row, null); ConvertView.setOnClickListener (View.OnClickListener ใหม่ () { @Override public void onClick (View v) { } }); TextView tittle =convertView.findViewById(R.id.title); ImageView imag =convertView.findViewById(R.id.list_image); tittle.setText( subjectData.SubjectName); Picasso.with(บริบท) .load( subjectData.Image) .into(imag); } ส่งคืน convertView; } @Override สาธารณะ int getItemViewType (ตำแหน่ง int) { ตำแหน่งกลับ; } @Override สาธารณะ int getViewTypeCount () { return arrayList.size (); } @Override บูลีนสาธารณะ isEmpty () { คืนค่าเท็จ; }}

ขั้นตอนที่ 5 − สร้างคลาส SubjectData เพิ่มรหัสต่อไปนี้ใน src/ SubjectData.java

คลาส SubjectData { สตริง SubjectName; ลิงค์สตริง; ภาพสตริง; SubjectData สาธารณะ (ชื่อหัวเรื่องสตริง, ลิงก์สตริง, ภาพสตริง) { this.SubjectName =subjectName; this.Link =ลิงค์; this.Image =ภาพ; }}

ขั้นตอนที่ 6 − ในคลาส CustomAdapter เราได้แสดงอิมเมจแหล่งที่มาของอินเทอร์เน็ต เพื่อแสดงภาพแหล่งอินเทอร์เน็ต เราได้เพิ่มห้องสมุดปิกัสโซตามที่แสดงด้านล่าง

Picasso.with(context).load(subjectData.Image).into(imag);

ขั้นตอนที่ 7 − สำหรับการนำไลบรารี่ของ picasso ไปใช้ เราต้องเพิ่มไลบรารีของ picasso ใน gradle ดังที่แสดงด้านล่าง

<ก่อนหน้า>ใช้ปลั๊กอิน:'com.android.application'android { compileSdkVersion 28 defaultConfig { applicationId "com.example.andy.myapplication" minSdkVersion 15 targetSdkVersion 28 versionCode 1 versionName "1.0" testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner " } buildTypes { ปล่อย { minifyEnabled false proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro' } }} การพึ่งพา { การนำไปใช้ fileTree (dir:'libs' รวมถึง:['*.jar'] ) การใช้งาน 'com.android.support:appcompat-v7:28.0.0' การใช้งาน 'com.android.support.constraint:constraint-layout:1.1.3' การทดสอบการใช้งาน 'junit:junit:4.12' การใช้งาน 'com.squareup.picasso :picasso:2.5.1' androidTestImplementation 'com.android.support.test:runner:1.0.2' androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'}

ขั้นตอนที่ 8 − ในการเข้าถึงข้อมูลอินเทอร์เน็ต เราต้องให้สิทธิ์อินเทอร์เน็ตเพื่อแสดงรายการไฟล์ดังที่แสดงด้านล่าง

     <หมวดหมู่ android:name ="android.intent.category.LAUNCHER" />   

มาลองเรียกใช้แอปพลิเคชันของคุณกัน ฉันคิดว่าคุณได้เชื่อมต่ออุปกรณ์มือถือ Android จริงกับคอมพิวเตอร์ของคุณ ในการรันแอพจาก android studio ให้เปิดไฟล์กิจกรรมของโปรเจ็กต์แล้วคลิกไอคอน Run จากแถบเครื่องมือ เลือกอุปกรณ์มือถือของคุณเป็นตัวเลือก จากนั้นตรวจสอบอุปกรณ์มือถือของคุณซึ่งจะแสดงหน้าจอเริ่มต้นของคุณ

จะแสดงรายการรูปภาพและข้อความใน ListView ใน Android ได้อย่างไร

เรากดไปที่หัวข้อก็จะเปิดลิงค์ดังรูปด้านล่างค่ะ

จะแสดงรายการรูปภาพและข้อความใน ListView ใน Android ได้อย่างไร