Sample applet to generate posters (java backend)
Aug 29, 2020 pm 05:06 PM【相關(guān)學(xué)習(xí)推薦:小程序開(kāi)發(fā)教程】
實(shí)現(xiàn)方案
前端人員,提供相關(guān)的html頁(yè)面, 后端人員提供接口,前端人員通過(guò)參數(shù)設(shè)置html頁(yè)面需要渲染的內(nèi)容, 最后使用wkhtmltoimage或者phantomjs 對(duì)html 進(jìn)行截圖生成海報(bào), 個(gè)人感覺(jué)wkhtmltoiamge 比phantomjs 要快一點(diǎn),穩(wěn)定一點(diǎn)我主要說(shuō)下wkhtmltoimage的實(shí)現(xiàn)方案
實(shí)現(xiàn)步驟
? 安裝環(huán)境
? ? 官網(wǎng)地址:https://wkhtmltopdf.org/
? ? ?windows: 下載安裝包安裝即可
? ? ?linux:? 下載對(duì)應(yīng)的安裝包 ,還需安裝對(duì)應(yīng)中文字體(phantomjs 也需要安裝字體),html中需要聲明引用
yum install libjpeg libXrender libXext xorg-x11-fonts-75dpi.noarch xorg-x11-fonts-Type1?bitmap-fonts-cjk
rpm -ivh wkhtmltox-0.12.6-1.centos7.x86_64.rpm
安裝字體
yum install bitmap-fonts-cjk
mkdir /usr/share/fonts/win
拷貝字體到?/usr/share/fonts/win下
cd /usr/share/fonts/win
mkfontscale
mkfontdir
fc-cache
相關(guān)代碼
?利用java 執(zhí)行命令 調(diào)用wkhtmltoImage 設(shè)置相關(guān)參數(shù),具體參數(shù)查看wkhtmltoImage 命令提示
package com.yumingzhu.wxweb.util; import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamReader; /** * @Description * @Author yumigzhu * @Date 2020/7/22 20:12 */ public class CustomWKHtmlToPdfUtil { private static String tempPath = "C:/apps/tmpFile";// 圖片保存目錄 public static String getCommand(String htmlToImage, String sourceFilePath, String targetFilePath) { //--quality 設(shè)置為50 是比較合適的, 默認(rèn)的94 可能會(huì)導(dǎo)致圖片文件過(guò)大 ProcessBuilder pb = new ProcessBuilder(htmlToImage, "--crop-w", "800", "--width", "800","--quality", "50", sourceFilePath, targetFilePath); Process process; try { process = pb.start(); //注意,調(diào)用process.getErrorStream()而不是process.getInputStream() BufferedReader errStreamReader = new BufferedReader(new InputStreamReader(process.getErrorStream())); System.out.println("read errstreamreader"); String line = null; line = errStreamReader.readLine(); while (line != null) { System.out.println(line); line = errStreamReader.readLine(); } process.destroy(); System.out.println("destroyed process"); } catch (IOException e) { e.printStackTrace(); } return targetFilePath; } public static void main(String[] args) throws Exception { String imagePath = tempPath + "/" + System.currentTimeMillis() + ".png";//圖片路徑 System.out.println(imagePath); String htmlToImage = "E:\\softwareAPP\\wkhtmltopdf\\bin\\wkhtmltoimage.exe"; CustomWKHtmlToPdfUtil.getCommand(htmlToImage, "file:///G:/share/text_none_title_share/index.html", imagePath); System.out.println("執(zhí)行完成"); } }
踩坑記錄
如果html頁(yè)面設(shè)置的寬高比較小, 這樣截出來(lái)的圖片也會(huì)比較小,比較模糊,,? 增大html 的寬高,可以使圖片更清晰,這樣會(huì)導(dǎo)致截出來(lái)的圖片文件更大,這樣用戶在小程序下載過(guò)程會(huì)更慢,這里需要自己權(quán)衡
wkhtmlImage 對(duì) css3? linear-gradient? 不支持,不能使用樣式下劃線,可以考慮使用圖片代替
中文字體需要聲明引用,才能生效
相關(guān)學(xué)習(xí)推薦:java基礎(chǔ)教程
The above is the detailed content of Sample applet to generate posters (java backend). For more information, please follow other related articles on the PHP Chinese website!

Hot AI Tools

Undress AI Tool
Undress images for free

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Clothoff.io
AI clothes remover

Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Hot Tools

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Learn the correct way to set up Contact Photos and Posters Contact Photos and Posters is a new feature that can be set up in iOS 17 for your contact cards and other contacts saved on your iPhone. For those who don’t know, the feature allows you to personalize the look of your call screen with custom posters, which you can design with photos, names, colors, fonts, emojis, and Memoji. Once created, contact posters can be shared with your saved contacts or restricted so that only a few selected people can view them. To learn how to create your own contact poster and how to share it with others, you can check out the guide at the following link: Contact Photos and Contact Posters Disabled: 8 Fixes Explained Despite Setting Contact Photos

With the popularity of mobile Internet technology and smartphones, WeChat has become an indispensable application in people's lives. WeChat mini programs allow people to directly use mini programs to solve some simple needs without downloading and installing applications. This article will introduce how to use Python to develop WeChat applet. 1. Preparation Before using Python to develop WeChat applet, you need to install the relevant Python library. It is recommended to use the two libraries wxpy and itchat here. wxpy is a WeChat machine

1. Check if your iPhone supports iOS17 If the contact poster feature does not work on your iPhone, the first thing you should do is check if your iPhone supports iOS17. This new feature is only available on iPhones running iOS 17, so be sure to update your phone to the latest update. Additionally, even if your iPhone is running iOS17, your contacts should have iPhones with iOS17 updates. Here is a list of all iPhones that support iOS17: iPhone15, 15PlusiPhone15Pro, 15ProMaxiPhone14, 14PlusiPhone14Pro, 1

Implementing card flipping effects in WeChat mini programs In WeChat mini programs, implementing card flipping effects is a common animation effect that can improve user experience and the attractiveness of interface interactions. The following will introduce in detail how to implement the special effect of card flipping in the WeChat applet and provide relevant code examples. First, you need to define two card elements in the page layout file of the mini program, one for displaying the front content and one for displaying the back content. The specific sample code is as follows: <!--index.wxml-->&l

How to Personalize Calls on iPhone Apple’s iOS 17 introduces a new feature called Contact Posters that allows you to personalize the look of your call screen on your iPhone. This feature allows you to design a poster using selected photos, colors, fonts, and Memoji as contact cards. So when you make a call, your custom image will appear on the recipient's iPhone exactly as you envisioned. You can choose to share your unique contact poster with all your saved contacts, or choose who can see it. Likewise, during a call exchange, you will also see other people's contact posters. Additionally, Apple lets you set specific contact photos for individual contacts, making calls from those contacts

Who can view your contact photos and posters on iPhone? Apple offers options for personalizing how you appear on someone's iPhone when they call or send a message. The options include Memoji, simple text, or a custom photo with effects as your contact photo and display image. You are free to change these selections at any time and switch between profiles on the contact card. Additionally, Apple is giving you the ability to control who can view and access photos or display images of your choice on iOS17. You can decide to share these with individuals saved in your contact list, or you can set your iPhone to prompt you every time you interact with a contact. If you wish, you can also disable the name permanently

According to news from this site on October 31, on May 27 this year, Ant Group announced the launch of the "Chinese Character Picking Project", and recently ushered in new progress: Alipay launched the "Chinese Character Picking-Uncommon Characters" mini program to collect collections from the society Rare characters supplement the rare character library and provide different input experiences for rare characters to help improve the rare character input method in Alipay. Currently, users can enter the "Uncommon Characters" applet by searching for keywords such as "Chinese character pick-up" and "rare characters". In the mini program, users can submit pictures of rare characters that have not been recognized and entered by the system. After confirmation, Alipay engineers will make additional entries into the font library. This website noticed that users can also experience the latest word-splitting input method in the mini program. This input method is designed for rare words with unclear pronunciation. User dismantling

Mini programs can use react. How to use it: 1. Implement a renderer based on "react-reconciler" and generate a DSL; 2. Create a mini program component to parse and render DSL; 3. Install npm and execute the developer Build npm in the tool; 4. Introduce the package into your own page, and then use the API to complete the development.
