PHP自定義生成圖片——靜態
阿新 • • 發佈：2018-11-28
大家有沒有發現，許多的表情都是快速生成的，並不是人們開啟PS等P圖軟體一個個P的
這篇部落格先來講解PHP+html簡單生成靜態圖片
拿啥圖裝X或者來示範呢
嘿嘿
哈哈，CSDN部落格，應該有代表性了吧
然後，想想修改啥
訪問。。排名。。名字。。等等
emmm
demo檔案目錄
解釋下：
bootstrap是一個開源的UI，說白了就是讓網頁變得好看的一個東西，可以忽略（主要是html太難看看著不舒服，雖然還是不好看）
bg.jpg 是背景圖片，我們需要在這個上面進行編輯
boke.html 表單提交介面
csdn.php 生成圖片介面（主要的）
demo.jpg 就是上面的原始圖
index.php 顯示介面
put.html 輸出圖片介面
stsong.ttf 字型檔案，這個是宋體
bg.jpg如下
我們把需要更改的地方先處理掉，最上面的那個懶得弄了，簡單介紹
boke.html
先引入了bootstapUI，然後加入了一個圖片，就是原始圖顯示，加入一個表單
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>生成CSDN部落格圖片</title> <link href="bootstrap/css/bootstrap.css" rel="stylesheet"> </head> <body> <img src="demo.jpg" width="50%" style="margin:80px 25% 80px 25%;"/> <form class="form-horizontal" role="form" method="get" action=csdn.php> <div class="form-group" > <label class="col-sm-4 control-label">CSDN名稱</label> <div class="col-sm-5"> <input type="text" name="name" class="form-control" placeholder="請輸入CSDN名字"> </div> </div> <div class="form-group"> <label class="col-sm-4 control-label">訪問人數</label> <div class="col-sm-5"> <input type="text" name="people" class="form-control" placeholder="請輸入訪問人數"> </div> </div> <div class="form-group"> <label class="col-sm-4 control-label">排名</label> <div class="col-sm-5"> <input type="text" name="ranking" class="form-control" placeholder="請輸入排名"> </div> </div> <div class="form-group"> <label class="col-sm-4 control-label">積分</label> <div class="col-sm-5"> <input type="text" name="integral" class="form-control" placeholder="請輸入積分"> </div> </div> <div class="form-group" > <div class="col-sm-offset-4 col-sm-5"> <button type="submit" class="btn btn-info btn-block" >提交生成</button> </div> </div> </form> </body> </html>
csdn.php
這裡是引用的php的GD庫寫的
主要的方法是imageTtfText，我寫的不詳細，不過我找到了一個不錯的
可以瞭解imageTtfText——傳送
什麼xy啊可以在ps中取出來
<?php /** * Created by PhpStorm. * User: 莫言情難忘 * Date: 2018/11/21 * Time: 21:10 */ header("content-type:image/jpeg"); $name = $_GET['name']?$_GET['name']:"莫言情難忘"; $people = $_GET['people']?$_GET['people']:"99萬+"; $ranking = $_GET['ranking']?$_GET['ranking']:"99萬+"; $integral = $_GET['integral']?$_GET['integral']:"666666"; $im = imagecreatetruecolor(384, 438); // 設定畫布 $bg = imagecreatefromjpeg('bg.jpg'); // 設定背景圖片 imagecopy($im,$bg,0,0,0,0,384,438); // 將背景圖片拷貝到畫布相應位置 imagedestroy($bg); // 銷燬背景圖片 $font = __DIR__ . '/stsong.ttf'; // 設定字型 // 設定字型，指向ttf檔案 $blacka = imagecolorallocate($im, 15, 23, 25); // 顏色 /* 寫入內容 */ imagettftext($im, 15, 0, 96, 138, $blacka, $font,$name ); // 寫入名稱 imagettftext($im, 15, 0, 97, 138, $blacka, $font,$name ); // 這裡x+1的原因是：這裡字型應該設定為粗體，我懶得找了，直接x+1實現粗體這個方式 imagettftext($im, 15, 0, 252, 325, $blacka, $font, $people); // 寫入人數 imagettftext($im, 15, 0, 253, 362, $blacka, $font, $ranking); // 寫入排名 imagettftext($im, 15, 0, 84, 361, $blacka, $font, $integral); // 寫入積分 imagejpeg($im); // 生成jpeg格式圖片 imagedestroy($im); // 銷燬圖片
index.php
不解釋了，看下吧
<?php
/**
* Created by PhpStorm.
* User: 莫言情難忘
* Date: 2018/11/21
* Time: 21:32
*/
if(isset($_GET['name'])){ // 如果使用者已經輸入資訊，拼接生成圖片
$url = "csdn.php?name=".$_GET['name']."&people=".$_GET['people']."&ranking=".$_GET['ranking']
."&integral=".$_GET['integral'];
include 'put.html'; // 引入生成圖片頁面
}else{
include 'boke.html'; // 引入填寫表單頁面
}put.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>生成成功</title>
</head>
<body>
<img src="<?php echo $url ?>" />
</body>
</html>
最終結果是
很多東西都可以替換，我只是懶而已，寫個部落格太費力了，畢竟我是理科生。。。
連結: https://pan.baidu.com/s/1zEOL8b9oS9pD3t52jMwrag
提取碼: 6666