在《物联网平台搭建的全过程介绍(八)——利用JDBC实现网上注册用户和登录功能》中介绍了利用JDBC实现用户注册和登录的功能,今天继续介绍登录之后要做的事情。
登录是系统的准入窗口,登录之后就需要和数据库进行交互了。这一讲介绍读取file表中pdf文件名称、文件链接和更新日期等内容,并利用listview和SimpleAdapter搭配进行展示。在文件显示界面,点击文件所在行,可以在线阅读文件内容。
目录
一、准备工作
1、在mysql上创建一个“file”的表格
2、在服务器上传一篇pdf文档
3、把文档信息填入“file”表格内
二、设计layout
在《物联网平台搭建的全过程介绍(八)——利用JDBC实现网上注册用户和登录功能》的基础上,layout有如下变化,把第(八)节中的activity_main.xml文件改名为activity_login.xml还做为登录界面,新增三个layout文件:activity_main.xml、lv_documents_layout.xml和readwebviewpdf.xml。
activity_main.xml是用listview来展示从mysql中读取到的文档情况,lv_documents_layout.xml是listview中的控件布局,readwebviewpdf.xml是显示pdf的界面。
1、新增activity_main.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"
android:id="@+id/mainpdf"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="0dp"
android:layout_marginBottom="0dp"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="0dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:gravity="center"
android:orientation="horizontal">
<TextView
android:id="@+id/device_lable"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.6"
android:layout_marginTop="0dp"
android:gravity="center"
android:textColor="@color/black"
android:textSize="20dp"
android:text="文件列表"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_marginLeft="0dp"
android:layout_marginRight="0dp"
android:orientation="horizontal">
<TextView
android:id="@+id/device_devicename"
android:layout_width="10dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_weight="1"
android:gravity="center"
android:textColor="@color/forestgreen"
android:textSize="18dp"
android:text="序号"/>
<TextView
android:id="@+id/device_devicestate"
android:layout_width="120dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:textColor="@color/forestgreen"
android:textSize="18dp"
android:text="文件名称"/>
<TextView
android:id="@+id/device_look"
android:layout_width="30dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:textColor="@color/forestgreen"
android:textSize="18dp"
android:text="更新日期"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="0.99"
android:layout_marginBottom="10dp"
android:orientation="vertical">
<ListView
android:id="@+id/lv_dashboard"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginBottom="0dp"
android:gravity="center"
>
</ListView>
</LinearLayout>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
2、新增lv_documents_layout.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="horizontal"
android:layout_marginTop="5dp"
android:layout_marginLeft="0dp">
<TextView
android:id="@+id/lv_documents_number"
android:layout_width="10dp"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
android:layout_weight="1"
android:textSize="14dp"
android:gravity="center"
/>
<TextView
android:id="@+id/lv_documents_name"
android:layout_width="120dp"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
android:layout_weight="1"
android:textSize="14dp"
android:gravity="left"
/>
<TextView
android:id="@+id/lv_documents_date"
android:layout_width="30dp"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
android:layout_weight="1"
android:textSize="14dp"
android:gravity="center"
/>
</LinearLayout>
3、readwebviewpdf.xml
这个文件是用来显示pdf文档的主界面。
<?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=".ReadWebViewPdf">
<WebView
android:id="@+id/view_web"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>
三、在app下建立一个assets文件夹
文件夹内放两个文件:index.html和index.js。这两个是webviewpdf所需要的文件。
1、index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
<title>Document</title>
<style type="text/css">
canvas {
width: 100%;
height: 100%;
border: 1px solid black;
}
</style>
<script src="https://unpkg.com/pdfjs-dist@1.9.426/build/pdf.min.js"></script>
<script type="text/javascript" src="index.js"></script>
</head>
<body>
</body>
</html>
2、index.js
var url = location.search.substring(1);
PDFJS.cMapUrl = 'https://unpkg.com/pdfjs-dist@1.9.426/cmaps/';
PDFJS.cMapPacked = true;
var pdfDoc = null;
function createPage() {
var div = document.createElement("canvas");
document.body.appendChild(div);
return div;
}
function renderPage(num) {
pdfDoc.getPage(num).then(function (page) {
var viewport = page.getViewport(2.0);
var canvas = createPage();
var ctx = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
page.render({
canvasContext: ctx,
viewport: viewport
});
});
}
PDFJS.getDocument(url).then(function (pdf) {
pdfDoc = pdf;
for (var i = 1; i <= pdfDoc.numPages; i++) {
renderPage(i)
}
});
三、java程序
1、创建一个MyDocument.class
这个类是装载文件内容的,有序号、文档名、链接地址和更新日期四部分内容。
package com.example.myjdbc;
public class MyDocument {
private String document_number;
private String document_name;
private String document_link;
private String document_date;
public MyDocument(String document_number, String document_name, String document_link, String document_date) {
this.document_number = document_number;
this.document_name = document_name;
this.document_link = document_link;
this.document_date=document_date;
}
public String getdocument_number() {
return document_number;
}
public String getdocument_name() {
return document_name;
}
public String getdocument_link() {
return document_link;
}
public String getdocument_date() {
return document_date;
}
}
2、LoginActivity.jave
这是登录程序,就是第八节中的MainActivity.java改名过来的,详细程序见第八节。
3、MainActivity.java
该部分程序,主要的功能就是从file表内把文件内容读取下来,然后利用SimpleAdapter把文件信息装进listview,使一行listview呈现多种布局形式。
package com.example.myjdbc;
import androidx.appcompat.app.AppCompatActivity;
import android.annotation.SuppressLint;
import android.content.Intent;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.view.View;
import android.widget.AdapterView;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.SimpleAdapter;
import android.widget.TextView;
import android.widget.Toast;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import java.util.Objects;
public class MainActivity extends AppCompatActivity {
ListView lv_dashboard;
private List<Map<String,Object>> lists;//多条装载文件序号、文件名、文件链接、更新日期的容器
private SimpleAdapter adapter;
SharedPreferences spDocument;//记录选定文件内容
String url;
String db_name;
String db_passwd;
boolean user_exist;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
url = getText(R.string.db_url).toString();
db_name = getText(R.string.db_name).toString();
db_passwd = getText(R.string.db_passwd).toString();
lv_dashboard=this.findViewById(R.id.lv_dashboard);
spDocument = this.getSharedPreferences("Document", MainActivity.MODE_PRIVATE);
lists = new ArrayList<>();
final ArrayList<MyDocument> mydocument=new ArrayList<>();
new Thread(new Runnable() {
@Override
public void run() {
try {
Class.forName("com.mysql.jdbc.Driver");
Connection connection = DriverManager.getConnection(url,db_name,db_passwd);
// String sql = "select * from device where devicename is not null";
String sql = "select * from file where document_name is not null";
PreparedStatement preparedStatement = connection.prepareStatement(sql);
ResultSet set1 =preparedStatement.executeQuery();
int i=0;
while(set1.next())
{
Map<String, Object> map = new HashMap<>();// 新建map类
i=i+1;
System.out.println(set1.getObject("document_name"));
System.out.println(set1.getObject("document_date"));
map.put("document_number", String.valueOf(i));
map.put("document_name", set1.getObject("document_name").toString());
map.put("document_date", set1.getObject("document_date").toString());
// map.put("number", String.valueOf(i));
// map.put("devicename", set1.getObject("document_name").toString());
// map.put("devicedate", set1.getObject("document_date").toString());
lists.add(map); // 将map中数据添加到lists中
mydocument.add(new MyDocument(String.valueOf(i),set1.getObject("document_name").toString(),set1.getObject("document_link").toString(),set1.getObject("document_date").toString()));
}
set1.close();
preparedStatement.close();
connection.close();
mHandler.sendEmptyMessage(0);
} catch (Exception e) {
e.printStackTrace();
}
}
}).start();
lv_dashboard.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
SharedPreferences.Editor editor_spDocument = spDocument.edit();
editor_spDocument.putString("Document_link",mydocument.get(position).getdocument_link());
editor_spDocument.apply();
System.out.println(mydocument.get(position).getdocument_link());
Intent intent = new Intent(MainActivity.this, ReadWebViewPdf.class);
startActivity(intent);
}
});
}
@SuppressLint("HandlerLeak")
private Handler mHandler = new Handler() {
@Override
public void handleMessage(Message msg) {
super.handleMessage(msg);
switch (msg.what) {
case 0:
adapter = new SimpleAdapter(MainActivity.this, lists, R.layout.lv_documents_layout
, new String[]{"document_number", "document_name", "document_date"}
, new int[]{R.id.lv_documents_number, R.id.lv_documents_name, R.id.lv_documents_date});
lv_dashboard.setAdapter(adapter);
adapter.notifyDataSetChanged();
break;
}
}
};
}
4、ReadWebViewPdf.java
package com.example.myjdbc;
import androidx.appcompat.app.AppCompatActivity;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import java.util.Objects;
public class ReadWebViewPdf extends AppCompatActivity {
private WebView mWebView;
private String url;
SharedPreferences spDocument;//选定文件
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.readwebviewpdf);
mWebView = (WebView) findViewById(R.id.view_web);
spDocument=this.getSharedPreferences("Document",this.MODE_PRIVATE);
url=spDocument.getString("Document_link",null);//取出选中文件链接
WebSettings webSettings = mWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
webSettings.setAllowFileAccess(true);
webSettings.setAllowFileAccessFromFileURLs(true);
webSettings.setAllowUniversalAccessFromFileURLs(true);
webSettings.setSavePassword(false);
webSettings.setBuiltInZoomControls(true);
webSettings.setSupportZoom(true);
mWebView.setWebChromeClient(new WebChromeClient());
mWebView.loadUrl("file:///android_asset/index.html?" + url);
}
}
四、测试结果
(全文结束)