Android应用:实现网络加载商品数据【OKHttp、Glide、Gson】

news2024/9/19 10:47:19

实现网络加载商品数据的功能:

1、在AndroidManifest.xml中声明网络权限;

2、在app/build.gradle中添加okhttp, glide, gson等必需的第3方库;

3、在MainActivity中通过OkHttpClient连接给定的Web服务,获取商品数据;对应的json数据为本地的json文件,名字为goods_list_data.json;数据内容为:[
{“id”:1,“count”:“5.4万”,“goodsName”:“富士拍立得相机”,“goodsPic”:“/img/polaroid.png”},
{“id”:2,“count”:“5.3万”,“goodsName”:“格兰仕微波炉”,“goodsPic”:“/img/microwave_oven.png”},
{“id”:3,“count”:“1.4万”,“goodsName”:“新国标电动车”,“goodsPic”:“/img/electric_vehicle.png”},
{“id”:4,“count”:“1.6万”,“goodsName”:“官方订制投影仪”,“goodsPic”:“/img/projector.png”},
{“id”:5,“count”:“0.4万”,“goodsName”:“美的35L烤箱”,“goodsPic”:“/img/oven.png”},
{“id”:6,“count”:“3.3万”,“goodsName”:“儿童学习桌”,“goodsPic”:“/img/learning_table.png”}
]
对应的图片也存储在本地的img文件中

4、使用gson库解析JSON格式的商品数据,转成java bean商品数据对象(Goods类)的列表;

5、创建MsgHandler类,用于异步更新商品列表;

6、在GoodsAdapter中通过glide控件加载并显示网络图片。


1.部署网络图片资源

首先,我们需要将对应的文件部署在一个简易的服务器(Tomcat)中,服务器中存放数据的目录结构如下图所示

E:.
├─goods
│  └─img
│  └─goods_list_data.json
└─WEB-INF

其中,ROOT目录在"apache-tomcat-9.0.65-windows-x64\webapps\ROOT"下,表示Tomcat服务器的根目录。

  • goods文件夹存放的是商品列表所用到的数据
  • 其中goods\img文件夹存放的是商品的图片资源
  • goods_list_data.json文件存放的是商品列表的数据,具体如下所示
[
  {"id":1,"count":"5.4万","goodsName":"富士拍立得相机","goodsPic":"/img/polaroid.png"},
  {"id":2,"count":"5.3万","goodsName":"格兰仕微波炉","goodsPic":"/img/microwave_oven.png"},
  {"id":3,"count":"1.4万","goodsName":"新国标电动车","goodsPic":"/img/electric_vehicle.png"},
  {"id":4,"count":"1.6万","goodsName":"官方订制投影仪","goodsPic":"/img/projector.png"},
  {"id":5,"count":"0.4万","goodsName":"美的35L烤箱","goodsPic":"/img/oven.png"},
  {"id":6,"count":"3.3万","goodsName":"儿童学习桌","goodsPic":"/img/learning_table.png"}
]

启动tomcat后,可访问http://localhost:8080/goods/goods_list_data.json展示信息
在这里插入图片描述

2.创建项目

  1. 打开Android Studio,并创建一个新的Android项目。
  2. 命名项目并选择适当的目标API级别和设备类型。
  3. 创建一个新的空白活动(Empty Activity)。

3.在AndroidManifest.xml中声明网络权限

在 AndroidManifest.xml 文件中添加以下权限声明,以便应用可以访问网络:

<uses-permission android:name="android.permission.INTERNET" />

在这里插入图片描述由于网络安全策略导致的问题,即不允许在明文(非加密)的情况下与 localhost 进行通信。这通常涉及到网络安全配置,特别是在 Android 9.0(API级别28)及更高版本中引入了更严格的网络安全策略;因此我们还需要进行配置网络安全配置文件

解决此问题的方法之一是使用 HTTPS 协议而不是 HTTP,因为 HTTPS 是加密的。

如果在本地测试应用,可以使用 Android 的网络安全配置文件来允许明文通信。

  1. res/xml 文件夹中创建一个名为 network_security_config.xml 的网络安全配置文件。如果该文件夹不存在,请手动创建。
<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <base-config cleartextTrafficPermitted="true">
        <trust-anchors>
            <certificates src="system" />
            <certificates src="user" />
        </trust-anchors>
    </base-config>
</network-security-config>

在这里插入图片描述

  1. AndroidManifest.xml 文件中,将这个网络安全配置文件应用于你的应用。在 <application> 元素内添加 android:networkSecurityConfig 属性,如下所示:
<application
    android:networkSecurityConfig="@xml/network_security_config"
    <!-- 其他属性和元素 -->
    >
    <!-- 其他元素 -->
</application>

在这里插入图片描述

这将允许你的应用在本地开发和测试过程中与 localhost 进行明文通信。但请注意,在生产环境中,强烈建议使用 HTTPS 以确保数据的安全传输。

如果你使用的是模拟器或真机设备,请确保重新构建和部署应用,以使配置生效。此外,如果你的服务器正在本地运行,请确保服务器端口和地址正确。

4.添加依赖库

app/build.gradle文件中添加OkHttp、Glide、Gson依赖库。

    implementation("com.squareup.okhttp3:okhttp:4.9.1")
    implementation("com.squareup.okhttp3:logging-interceptor:4.9.1")
    implementation("com.google.code.gson:gson:2.8.8")
    implementation("com.github.bumptech.glide:glide:4.12.0")
    annotationProcessor("com.github.bumptech.glide:compiler:4.12.0")

在这里插入图片描述

进行同步
在这里插入图片描述
等待安装依赖……

5.创建一个XML布局文件

res/layout文件夹中创建一个布局文件,例如activity_main.xml,用于显示商品数据。

<?xml version="1.0" encoding="utf-8"?>
<androidx.recyclerview.widget.RecyclerView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"/>

在这里插入图片描述
创建一个XML布局文件用于显示商品项
res/layout文件夹中创建一个布局文件,例如item_goods.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="wrap_content"
    android:orientation="vertical"
    android:padding="16dp">

    <ImageView
        android:id="@+id/goodsImageView"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:scaleType="centerCrop" />

    <TextView
        android:id="@+id/goodsNameTextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp" />
</LinearLayout>

在这里插入图片描述

6.创建一个Java Bean类

创建一个Goods类,用于表示商品数据。

public class Goods {
    private int id;
    private String count;
    private String goodsName;
    private String goodsPic;

    // Getters and setters
}

7.创建一个适配器类

创建一个自定义适配器类GoodsAdapter,用于将商品数据绑定到RecyclerView中。

public class GoodsAdapter extends RecyclerView.Adapter<GoodsAdapter.ViewHolder> {
    private List<Goods> goodsList;
    private Context context;

    public GoodsAdapter(Context context, List<Goods> goodsList) {
        this.context = context;
        this.goodsList = goodsList;
    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_goods, parent, false);
        return new ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        Goods goods = goodsList.get(position);
        holder.goodsNameTextView.setText(goods.getGoodsName());

        // Load and display image using Glide
        Glide.with(context)
            .load(goods.getGoodsPic())
            .into(holder.goodsImageView);
    }
    @Override
    public int getItemCount() {
        if (goodsList != null) {
            return goodsList.size();
        } else {
            return 0; // 返回0表示没有数据
        }
    }

    static class ViewHolder extends RecyclerView.ViewHolder {
        TextView goodsNameTextView;
        ImageView goodsImageView;

        ViewHolder(View itemView) {
            super(itemView);
            goodsNameTextView = itemView.findViewById(R.id.goodsNameTextView);
            goodsImageView = itemView.findViewById(R.id.goodsImageView);
        }
    }
}

8.实现网络加载数据

MainActivity.java中实现网络加载商品数据的功能。请确保你的goods_list_data.json文件位于app/src/main/assets文件夹下。

package com.leo.network;

import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.util.Log;
import android.view.View;

import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;

import com.google.gson.Gson;

import java.io.IOException;
import java.util.Arrays;
import java.util.List;

import okhttp3.OkHttpClient;
import okhttp3.Request;
import okhttp3.Response;

public class MainActivity extends AppCompatActivity {

    private RecyclerView recyclerView;
    private GoodsAdapter adapter;
    private List<Goods> goodsList;

    private static final int MSG_UPDATE_DATA = 1;
    private Handler msgHandler = new Handler(new Handler.Callback() {
        @Override
        public boolean handleMessage(Message msg) {
            if (msg.what == MSG_UPDATE_DATA) {
                adapter.notifyDataSetChanged();
            }
            return true;
        }
    });

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        recyclerView = findViewById(R.id.recyclerView);
        recyclerView.setLayoutManager(new LinearLayoutManager(this));
        adapter = new GoodsAdapter(this, goodsList);
        recyclerView.setAdapter(adapter);

        // Fetch data from the network
        fetchGoodsData();
    }

    private void fetchGoodsData() {

        new Thread(new Runnable() {
            @Override
            public void run() {
                try {
                    OkHttpClient client = new OkHttpClient();
                    Request request = new Request.Builder()
                            .url("http://10.0.2.2:8080/goods/goods_list_data.json")
                            .build();
                    Response response = client.newCall(request).execute();
                    if (response.isSuccessful()) {
                        String jsonData = response.body().string();
                        Log.d("Network", "Data fetched successfully: " + jsonData);

                        Gson gson = new Gson();
                        Goods[] goodsArray = gson.fromJson(jsonData, Goods[].class);

                        // 补全图片URL
                        for (Goods goods : goodsArray) {
                            goods.setGoodsPic("http://10.0.2.2:8080//goods" + goods.getGoodsPic());
                        }

                        goodsList = Arrays.asList(goodsArray);
                        msgHandler.sendEmptyMessage(MSG_UPDATE_DATA);

                        // 切换到主线程以更新UI
                        runOnUiThread(new Runnable() {
                            @Override
                            public void run() {
                                // 设置RecyclerView的适配器
                                adapter = new GoodsAdapter(MainActivity.this, goodsList);
                                recyclerView.setAdapter(adapter);
                            }
                        });

                    }
                } catch (IOException e) {
                    e.printStackTrace();
                    Log.e("Network", "Error fetching data: " + e.getMessage());
                }
            }
        }).start();
    }
}


替换"URL_TO_YOUR_JSON_DATA"为你的本地JSON文件的路径,例如:http://localhost:8080/goods/goods_list_data.json

注意,如果你是本地部署的tomcat,需要在Android默认的虚拟器中访问,需要改为“10.0.2.2

以下是对代码的一些说明:

  1. fetchGoodsData() 方法中创建了一个新的线程来执行网络请求。这是一个良好的实践,因为它确保网络请求不会阻塞主线程,以避免应用的响应性问题。

  2. 在网络请求成功后使用 Gson 库将 JSON 数据解析为 Goods 对象的数组,并补全了图片的URL。这确保了 Glide 能够正确加载图片。

  3. 使用 Handler 来更新UI,因为 UI更新必须在主线程中执行

  4. 在网络请求失败时,通过 Log.e 打印了错误消息,这有助于调试和问题排查。

实现效果
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1145042.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Android笔记(九):Compose组件的状态(一)

在使用Compose定义UI界面时&#xff0c;可以发现界面的变换往往与Compose组件内部的状态相关&#xff0c;当状态值发生变化时&#xff0c;Compose构成的可组合的界面也会刷新发生相应的变化。将在本笔记中将对可组合项的状态的定义、状态提升、状态丢失和状态的保存进行简单介绍…

Linux(Centos)防火墙允许通过端口增加操作记录

1、nginx -t #Nginx配置文件检查 上述截图代表检查没问题 上述截图检查配置文件配置错误&#xff0c;并提示错误文件位置 2、systemctl restart nginx #重启Nginx 重启Nginx失败 3、systemctl status nginx.service #查看Nginx服务状态 80端口被占导致服务启动失败 4、n…

Spring Boot进阶(93):体验式教程:手把手教你整合Spring Boot和Zipkin

&#x1f4e3;前言 分布式系统开发中&#xff0c;服务治理是一个比较重要的问题。为了更好地实现服务治理&#xff0c;需要解决服务跟踪问题&#xff0c;即如何对分布式系统中的服务进行监控和追踪。本文将介绍如何使用Zipkin进行服务跟踪&#xff0c;并结合Spring Boot进行整合…

【操作系统】文件管理大题总结

【操作系统】文件管理大题总结 文章目录 【操作系统】文件管理大题总结前置知识操作系统中的存储单位转换 1、目录管理中的典型问题分析基础例题&#xff1a;往年真题 2、外存的组织方式中的典型问题分析基础例题王道课后题往年真题 3、文件存储空问管理中的典型问题分析基础例…

Linux ln命令:建立链接文件

如果要想说清楚 ln 命令&#xff0c;则必须先解释下 ext 文件系统&#xff08;Linux 文件系统&#xff09;是如何工作的。我们在前面讲解了分区的格式化就是写入文件系统&#xff0c;而我们的 Linux 目前使用的是 ext4 文件系统。如果用一张示意图来描述 ext4 文件系统。 ext4 …

Django之登录注册

最近在准备上线一个网站&#xff08;基于django的编程技术学习与外包服务网站&#xff09;&#xff0c;所以会将自己的在做这个项目的过程中遇到的模块业务以及所涉及到的部分技术记录在CSDN平台里&#xff0c;一是希望可以帮到有需要的同学&#xff0c;二十以供自己后续回顾学…

Jmeter调用Python脚本实现参数互相传递的实现

这篇文章主要介绍了Jmeter调用Python脚本实现参数互相传递的实现&#xff0c;文中通过示例代码介绍的非常详细&#xff0c;对大家的学习或者工作具有一定的参考学习价值&#xff0c;需要的朋友们下面随着小编来一起学习学习吧 接口性能测试时&#xff0c;接口请求参数是根据一…

蓝桥杯每日一题2023.10.28

题目描述 递增三元组 - 蓝桥云课 (lanqiao.cn) 题目分析 60分解法&#xff1a; 直接暴力循环每一个数进行比较 #include<bits/stdc.h> using namespace std; const int N 2e5 10; typedef long long ll; ll n, a[N], b[N], c[N], ans; int main() {cin >> n;…

C++STL---Vector、List所要掌握的基本知识

绪论​ 拼着一切代价&#xff0c;奔你的前程。 ——巴尔扎克&#xff1b;本章主要围绕vector和list的使用&#xff0c;以及容器底层迭代器失效问题&#xff0c;同时会有对原码的分析和模拟实现其底层类函数。​​​​话不多说安全带系好&#xff0c;发车啦&#xff08;建议电脑…

shouldComponentUpdate 是做什么的?

目录 前言 生命周期函数 shouldComponentUpdate 的写法和用法 代码 事件和API 优缺点 方法 总结 理论 结论 shouldComponentUpdate 是 React 类组件中的一个生命周期方法&#xff0c;用于决定一个组件的 props 或 state 发生变化时是否应该重新渲染。默认情况下&…

HBuilderX 自定义语法提示

在开发实践中&#xff0c;会使用到各种第三方组件&#xff0c;比如Element UI&#xff0c;通常的做法是到官网中复制模板再在本地根据设计要求进行修改&#xff0c;或是从其它已经实现的组件中复制相似的内容。但每次复制粘贴确实比较麻烦。 在HBuilderx中可以设置代码块来创建…

上海高考语文命题趋势和备考建议?附1990年-2023年高考语文真题和答案资源

虽然语文是我们的母语&#xff0c;但是语文从小到大都是我们学习的重点&#xff0c;更是难点&#xff0c;分值也是最高的科目之一。甚至很多时候&#xff0c;语文科目的分值差会带来最终的分值差。综观各个省市的高考状元&#xff0c;基本上语文科目都在130分以上&#xff08;满…

JAVA中的垃圾回收器(1)

一)垃圾回收器概述: 1.1)按照线程数来区分: 串行回收指的是在同一时间端内只允许有一个CPU用于执行垃圾回收操作&#xff0c;此时工作线程被暂停&#xff0c;直至垃圾回收工作结束&#xff0c;在诸如单CPU处理器或者较小的应用内存等硬件平台不是特别优越的场合&#xff0c;出行…

【每日一题】合并两个有序数组

链接奉上&#xff1a;合并两个有序数组 目录 直接合并后排序&#xff1a;思路&#xff1a;代码实现&#xff1a; 双指针思路&#xff1a;代码实现&#xff1a; 直接合并后排序&#xff1a; 思路&#xff1a; 将nums2直接合并到nums1后边&#xff0c;并进行排序 代码实现&…

LeetCode题:1:两数之和

&#xff08;1&#xff09;、题目要求&#xff1a; &#xff08;2&#xff09;、解题思路&#xff1a; 由上图可知&#xff0c;target 20&#xff0c;这题有多种解法 1、暴力枚举的方法&#xff1a; 但是这样时间复杂度就很高了&#xff0c;要定义两个下标&#xff0c;列举出所…

CSP-J 2023 第二轮认证入门级(含答案)

一。题目 二。答案 T1 ⼩苹果&#xff08;apple&#xff09; 每⼀轮拿掉的苹果数量为 。模拟拿苹果的过程&#xff0c;每⼀轮中令 &#xff0c;当 时最后⼀个苹果会被拿掉。 时间复杂度为对数。 #include <iostream> using namespace std; int n; int ans1, ans2; boo…

Ajax学习笔记第三天

做决定之前仔细考虑&#xff0c;一旦作了决定就要勇往直前、坚持到底&#xff01; 【1 ikunGG邮箱注册】 整个流程展示&#xff1a; 1.文件目录 2.页面效果展示及代码 mysql数据库中的初始表 2.1 主页 09.html:里面代码部分解释 display: inline-block; 让块元素h1变成行内…

第二次课10.28

hash 计算接口 Crypto API &#xff08;证书&#xff0c;对称加密&#xff0c;非对称加密&#xff0c;编码和解码&#xff09; CryptAcquireContext CryptCreateHash CryptReleaseContext CryptHashData CryptDestroyHash CryptGetHashParam 注册表操作接口 RegEnumKeyEx RegE…

如何快速解决d3dcompiler_43.dll缺失问题?五种方法快速解决

在计算机使用过程中&#xff0c;我们常常会遇到一些错误提示&#xff0c;其中之一就是“D3DCompiler_43.dll缺失”。这个错误通常会导致游戏、应用程序或系统无法正常运行。为了解决这个问题&#xff0c;我们需要采取一些修复方案来恢复缺失的文件。本文将介绍五个修复D3DCompi…

Vue 3响应式对象: ref和reactive

目录 什么是响应式对象&#xff1f; Ref Reactive Ref vs Reactive 适用场景&#xff1a; 访问方式&#xff1a; 引用传递&#xff1a; 性能开销&#xff1a; 响应式对象优点 响应式对象缺点 总结 Vue 3作为一种流行的JavaScript框架&#xff0c;提供了响应式编程的…