【專案分享】還有誰不服？？這款隨機表情包生成器征服你！！

孤丨焰發表於2020-10-12
隨機

在這裡插入圖片描述



在聊天中，你是否認為自己相簿太小？你是否經常鬥圖？你鬥圖水平還是青銅水平？


有了它，你就是鬥圖界王者!!!


大家好，我是孤焰。今天在學校裡學到了一個比較有趣的專案——隨機表情包生成器，在這裡分享給大家。

一、思路分享

 簡單來說，表情包隨機生成器功能實現分為以下兩點：

  • 隨機爬取表情包
  • 隨機顯示錶情包

二、原始碼實現

 首先先從網頁上面爬取表情包，下面原始碼以‘我愛鬥圖’網為例，並爬取其中的隨機表情：

 下面的原始碼為‘我愛鬥圖’網的爬蟲程式碼：

package com.rand;

import java.io.*;
import java.net.URL;
import java.util.ArrayList;
import java.util.List;
import java.util.regex.Matcher;
import java.util.regex.Pattern;

/**
 * @ClassName com.rand.Crawling
 * @Author 孤焰
 * @Date 2020/10/12 10:33
 * @Version 1.0
 **/
public class Crawling {
    //篩選<img>標籤
    private String REGEX_IMG = "<(img|IMG)(.*?)(/>|></img>|>)";
    //篩選data-backup屬性
    private String REGEX_BACKUP = "(data-backup)=(\"|\')(.*?)(\"|\')";
    //篩選圖片網址
    private String REGEX_HTTP = "(https://)(.*?)(.jpg)";

    //下載圖片的地址 這裡的地址為圖片的下載地址，這裡地址以d盤為例
    private String ACCESS = "D:\\";

    //獲取網站html的字串型別
    public String getHtml(String access) throws Exception {
        URL url = new URL(access);
        InputStream in = url.openStream();
        //獲取網站的html程式碼
        InputStreamReader isr = new InputStreamReader(in);
        BufferedReader bis = new BufferedReader(isr);

        //將輸入流轉換為String型別的字串
        String html;
        StringBuffer stringBuffer = new StringBuffer();
        while ((html = bis.readLine()) != null) {
            stringBuffer.append(html, 0, html.length());
            stringBuffer.append("\n");
        }


        //關閉輸入流
        in.close();
        isr.close();
        bis.close();

        //返回獲取到的網站html結構的字串型別
        return stringBuffer.toString();
    }

    //將圖片的連結從html結構中提取出來（通過正規表示式）
    public List<String> extract(String html) throws Exception {
        //用於儲存網頁中爬取的網址
        List<String> list = new ArrayList<>();

        Pattern pattern = Pattern.compile(REGEX_IMG);
        Matcher matcher = pattern.matcher(html);
        while (matcher.find()) {
            Pattern pattern2 = Pattern.compile(REGEX_BACKUP);
            Matcher matcher2 = pattern2.matcher(matcher.group());

            while (matcher2.find()) {
                Pattern pattern3 = Pattern.compile(REGEX_HTTP);
                Matcher matcher3 = pattern3.matcher(matcher2.group());

                while (matcher3.find()) {
                    list.add(matcher3.group());
                }
            }
        }

        return list;
    }

    //下載圖片
    public void download(List<String> picture) throws Exception {
        InputStream in = null;
        FileOutputStream fos = null;

        System.out.println("共" + picture.size() + "張圖片");

        int i = 1;
        for (String link : picture) {

            String pictureName = link.substring(link.lastIndexOf("."), link.length());
            URL url = new URL(link);
            in = url.openStream();
            fos = new FileOutputStream(new File(ACCESS + "\\" + i + pictureName));

            byte []bytes = new byte[1024];
            int length = 0;
            System.out.println("開始下載：" + link);
            while ((length = in.read(bytes)) != -1) {
                fos.write(bytes, 0, length);
            }

            System.out.println("第" + i + "個圖片下載完成");

            ++i;

            in.close();
            fos.close();
        }

        System.out.println("下載結束");

    }
}

 下圖為上述爬蟲程式碼的執行效果圖：
在這裡插入圖片描述

效果圖1


在這裡插入圖片描述

效果圖2


 爬取表情包成功之後，就差一個隨機顯示錶情包的介面了，話不多說，直接上原始碼：

<%--
  Created by IntelliJ IDEA.
  User: 孤焰
  Date: 2020/10/12
  Time: 10:26
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>隨機表情包生成器</title>
    <style type="text/css">
        div {

            height: 600px;
            width: 600px;
            margin-top: 50px;
            text-align: center;
            margin-left:40%;
        }

        #img {
            display: block;
            height: 500px;
            width: 500px;
            border: 2px solid black;
            margin: auto;
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
        }

    </style>
</head>
<body>
<div>
    <img src="" id="img" >
</div>
</body>

<script type="text/javascript">
    var count = 40;
    var num = Math.round(Math.random() * count);
    var img = document.getElementById("img");
    img.src = "img/" + num + ".jpg";
</script>

</html>

 這個原始碼的核心在script標籤中，script標籤負責隨機表情包的顯示。

三、效果截圖

 當兩塊功能模組編寫完成之後就可以，我們這個簡單的專案就完成了，下面為效果截圖：

在這裡插入圖片描述

四、最後

都看到最後了，求求大家點個贊再走吧！你的支援是博主創作的最大動力。

在這裡插入圖片描述

相關文章