android listview展現圖片

時間  2020-05-21
標籤 android listview 展現 圖片 欄目 Android 简体版
原文   原文鏈接

最近學習android開發，感觸頗多，和網站開發對比，仍是有很大的差距，在這裏記錄一下。前端

android listview展現圖片

在網站開發上，展現圖片很是簡單，一個HTML img標籤就搞定，加上服務器無非就是在view裏動態展現，或者用ajax動態獲取，或者用vue等動態獲取js展現。vue

但在android上就很是麻煩，先要把網絡圖片下載，轉換成流文件，再轉換成drawable資源文件才能在app上顯示，裏面的xml各類配置，對於一個寫慣HTML的人來講很煩。java

主要步驟。android

假設在一個Listshow的二級頁面展現，ajax

首先要準備的東西，後端

Adapter，Adapter是鏈接後端數據和前端顯示的適配器接口，緩存

一些自定義的類，下載圖片的類imageloader，緩存的類memorycache,存文件的類filecache服務器

xml文件，主列表的xml，listview的xml，每次下載圖片覆蓋的drawable資源xml網絡

具體代碼：app

主要的activity

package com.example.huibeb;
import android.os.Bundle;
import android.widget.ListView;
import androidx.appcompat.app.AppCompatActivity;
import com.example.huibeb.model.ListmAdapter;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
public class Listshow extends AppCompatActivity {
    private List<Map<String, Object>> cats = new ArrayList<Map<String, Object>>();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_listshow);
        ArrayList<HashMap<String, String>> songsList = new ArrayList<HashMap<String, String>>();
        for (int i = 0; i < 4; i++) {
            HashMap<String, String> map = new HashMap<String, String>();

            map.put("listname", "暹羅貓"+i);
            map.put("listimgs", "http://img.bjyiyoutech.com/appimage/5de78277d60ee.jpg");
            songsList.add(map);
        }

        ListmAdapter adapter = new ListmAdapter(this,songsList);
        ((ListView) findViewById(R.id.listlist)).setAdapter(adapter);
    }
}

ListmAdapter，Adapter是鏈接後端數據和前端顯示的適配器接口，
package com.example.huibeb.model;
import android.app.Activity;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;
import androidx.annotation.NonNull;
import com.example.huibeb.R;
import com.example.huibeb.help.ImageLoader;
import java.util.ArrayList;
import java.util.HashMap;

public class ListmAdapter extends BaseAdapter {
    private Activity activity;
    private ArrayList<HashMap<String, String>> data;
    private static LayoutInflater inflater=null;
    public ImageLoader imageLoader; //用來下載圖片的類，後面有介紹

    public ListmAdapter(Activity a, ArrayList<HashMap<String, String>> d) {
        activity = a;
        data=d; //賦值列表
        inflater = (LayoutInflater)activity.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        imageLoader=new ImageLoader(activity.getApplicationContext());
    }
    public int getCount() {
        return data.size();
    }

    public Object getItem(int position) {
        return position;
    }

    public long getItemId(int position) {
        return position;
    }
    @NonNull
    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        View vi=convertView;
        if(convertView==null)
            vi = inflater.inflate(R.layout.lists, null);

        TextView listname = (TextView)vi.findViewById(R.id.listname); // 標題
        ImageView listimg=(ImageView)vi.findViewById(R.id.listimg); // 縮略圖

        HashMap<String, String> listm = new HashMap<String, String>();
        listm = data.get(position);
        // 設置ListView的相關值
        String aa = listm.get("listname");// 標題
        listname.setText(listm.get("listname"));// 縮略圖
        imageLoader.DisplayImage(listm.get("listimgs"), listimg);//下載並返回圖片資源
        return vi;

    }

}
memorycache緩存MemoryCache
package com.example.huibeb.help;
import android.graphics.Bitmap;

import java.lang.ref.SoftReference;
import java.util.Collections;
import java.util.HashMap;
import java.util.Map;

public class MemoryCache {
    private Map<String, SoftReference<Bitmap>> cache=Collections.synchronizedMap(new HashMap<String, SoftReference<Bitmap>>());//軟引用

    public Bitmap get(String id){
        if(!cache.containsKey(id))
            return null;
        SoftReference<Bitmap> ref=cache.get(id);
        return ref.get();
    }

    public void put(String id, Bitmap bitmap){
        cache.put(id, new SoftReference<Bitmap>(bitmap));
    }

    public void clear() {
        cache.clear();
    }

}
file緩存FileCache
package com.example.huibeb.help;
import android.content.Context;

import java.io.File;

public class FileCache {

    private File cacheDir;

    public FileCache(Context context){
        //找一個用來緩存圖片的路徑
        if (android.os.Environment.getExternalStorageState().equals(android.os.Environment.MEDIA_MOUNTED))
            cacheDir=new File(context.getExternalCacheDir(),"huibenb");
        else
            cacheDir=context.getCacheDir();
        if(!cacheDir.exists())
            cacheDir.mkdirs();
    }

    public File getFile(String url){

        String filename=String.valueOf(url.hashCode());
        File f = new File(cacheDir, filename);
        return f;

    }

    public void clear(){
        File[] files=cacheDir.listFiles();
        if(files==null)
            return;
        for(File f:files)
            f.delete();
    }


}

xml文件
主activity佈局文件 activity_listshow.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
    tools:context=".Listshow">

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:layout_editor_absoluteX="1dp"
        tools:layout_editor_absoluteY="1dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical" >


            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">

                <Button
                    android:id="@+id/button5"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:text="Button" />

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="horizontal">

                    <Button
                        android:id="@+id/button2"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:text="Button" />

                    <Button
                        android:id="@+id/button3"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:text="Button" />

                    <Button
                        android:id="@+id/button4"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:text="Button" />

                </LinearLayout>

            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical">

                <Button
                    android:id="@+id/button5"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:text="Button" />

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="horizontal">

                    <Button
                        android:id="@+id/button2"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:text="Button" />

                    <Button
                        android:id="@+id/button3"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:text="Button" />

                    <Button
                        android:id="@+id/button4"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:text="Button" />

                </LinearLayout>
            </LinearLayout>

            <ListView
                android:id="@+id/listlist"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />

        </LinearLayout>
    </ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
listView內容文件lists.xml
<?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" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/listimg"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"/>


            <TextView
                android:id="@+id/listname"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="TextView" />
        </LinearLayout>

    </LinearLayout>
</LinearLayout>
每次下載圖片要替換的drawable資源文件listimgtest.xml,注意這個要放在drawable文件夾下，@drawable/ihblogo是一個jpg圖片，默認加載的圖片請自行添加
<?xml version="1.0" encoding="utf-8"?><bitmap    xmlns:android="http://schemas.android.com/apk/res/android"    android:src="@drawable/ihblogo"    android:antialias="true"    android:dither="true"    android:filter="true"    android:gravity="center"    android:mipMap="false"    android:tileMode="disabled"    />
相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程