Godot3.5创建HTML代码的静态函数库 - H5Creator

企业开发 2023-04-06 13:53:03 阅读次数: 0

文章目录

H5Creator.gd

基本信息

脚本信息

项目 信息
文件名 H5Creator.gd
is_tool 否
extend -
class_name H5Creator

文件信息

项目 信息
项目名称 myAdd插件v3.0
文件路径 res://addons/myAdd/lib/H5Creator.gd
绝对路径 E:/【Godot-项目】/myAdd插件v3.0/addons/myAdd/lib/H5Creator.gd

其他信息

项目 信息
作者 @巽星石
备注 随意使用，开心就好

文档信息

项目 信息
文档创建时间 2022-09-25 15:04:25

概述

这是一个基于Godot3.5的GDScript编写的HTM5页面生成函数库。

提供了快速生成HTML标签的各种方法，用于生成HTML文档。

方法

double_tag(tag:String,string:String = “”,attrs:String = “”) -> String

闭合标签 - 返回一对闭合标签,形如： <tag[attrs]>string</tag>

其中tag为标签的名称，attrs部分传入标签的属性，string传入开始和结束标签之间的文字。

double_tag("h1")  // 返回 <h1></h1>

double_tag("h1","这是一级标题")  // 返回 <h1>这是一级标题</h1>

double_tag("h1","这是一级标题","class_name='heading_1'")  
// 返回 <h1 class_name='heading_1'>这是一级标题</h1>

double_tag("h1","这是一级标题","id='h1_1' class_name='heading_1'")  
// 返回 <h1 id='h1_1' class_name='heading_1'这是一级标题</h1>

注意：上面代码只是举例，建议使用H()方法生成H1-H6标题。

single_tag(tag:String,attrs:String = “”) -> String

单标签 - 返回一个自闭合标签，形如： <tag[attrs] />

single_tag("img")  // 返回 <img />
single_tag("img","src='1.jpg'")  // 返回 <img src='1.jpg'/>

注意：上面代码只是举例，建议使用img()方法生成图片。

H5_page(title:String, js:String = “”,css:String = “”,css_links:PoolStringArray = [],js_links:PoolStringArray = [],body:String = “”) -> String

生成一个HTML5页面基础框架。基于如下模板：

<!DOCTYPE html>
<html lang='zh_CN'>
<head>
	<meta charset='UTF-8'>
	<meta http-equiv='X-UA-Compatible' content='IE=edge'>
	<meta name='viewport' content='width=device-width, initial-scale=1.0'>
	<title>[title]</title>
	[css_links]
	[script_links]
	[style]
	[script]
</head>
<body>
	[body]
</body>
</html>

参数

参数 值类型 默认值 描述
title String - 页面的标题
js String “” 页面内的js代码
css String “” 页面内的CSS样式
css_links PoolStringArray [] 外部的css引用列表
js_links PoolStringArray [] 外部的js引用列表
body String “” 页面的正文部分

举例

var body =""
body += h5.H(1,"用GDScript生成HTML5页面测试")
body += h5.P("这只是一个简单的测试，用于后续复杂的静态页面和静态站生成。")
body += h5.H(2,"有序列表")
body += h5.OL([
    "item1",
    "item2",
    "item3",
])
body += h5.H(2,"无序列表")
body += h5.UL([
    "item1",
    "item2",
    "item3",
])

var page = h5.H5_page(
    "这是一个H5页面",
    "alert()",
    "body{background-color:#ccc;}",
    [],
    [],
    body
)
h5.saveString("C:/Users/Lenovo/Desktop/2.htm",page)

上面的代码，将在桌面创建名为”2.htm“的网页文件，并在其中填入如下的HTML代码：

<!DOCTYPE html>
<html lang='zh_CN'>
<head>
	<meta charset='UTF-8'>
	<meta http-equiv='X-UA-Compatible' content='IE=edge'>
	<meta name='viewport' content='width=device-width, initial-scale=1.0'>
	<title>这是一个H5页面</title>
			<style>
body{
     
     background-color:#ccc;}
</style>
	<script>
alert()
</script>
</head>
<body>
	<h1>用GDScript生成HTML5页面测试</h1>
<p>这只是一个简单的测试，用于后续复杂的静态页面和静态站生成。</p>
<h2>有序列表2</h2>
<ol>
<li>item1</li>
<li>item2</li>
<li>item3</li>
</ol>
<h2>无序列表</h2>
<ul>
<li>item1</li>
<li>item2</li>
<li>item3</li>
</ul>

</body>
</html>

H(level:int,title:String) -> String

生成H1-H6的标题标签。

H(1)             // 返回 <h1></h1>
H(1,"一级标题")   // 返回 <h1>一级标题</h1>

P(content:String) -> String

生成段落。

P("这是一个普通的段落")  // 返回 <p>这是一个普通的段落</p>

A(url:String = “”,title:String = “”) -> String

生成超链接。

A() // 返回 <a></a>
A("https://www.baidu.com/") // 返回 <a href='https://www.baidu.com/'></a>
A("https://www.baidu.com/","百度") // 返回 <a href='https://www.baidu.com/'>百度</a>

img(url:String) -> String

生成img标签。

img("1.jpg")  // 返回 <img src='1.jpg' />
img("")  // 返回 <img />

OL(str_list:PoolStringArray) -> String

生成有序列表。

OL([
	"itm1",
	"itm2",
	"itm3"
])

生成如下HTML代码：

<ol>
    <li>itm1</li>
    <li>itm2</li>
    <li>itm3</li>
</ol>

也就是如下HTML效果：

  1. itm1
  2. itm2
  3. itm3

UL(str_list:PoolStringArray) -> String

生成无序列表。

<ul>
    <li>itm1</li>
    <li>itm2</li>
    <li>itm3</li>
</ul>

也就是如下HTML效果：

  • itm1
  • itm2
  • itm3

HR() -> String

返回<hr>。

BR() -> String

返回<br>。

table(fields:PoolStringArray,rows:Array) -> String

用fields指定的字段和rows指定的记录创建一个HTML表格。

table(
	["姓名","姓别","年龄"],
	[
		["张三","男","25"],
		["张三","男","25"],
		["张三","男","25"],
	]
)

生成如下HTML代码：

<table border=0>
<tr>
    <th>姓名</th>
	<th>姓别</th>
	<th>年龄</th>
</tr>
<tr>
    <td>张三</td>
	<td>男</td>
	<td>25</td>
</tr>
<tr>
    <td>张三</td>
	<td>男</td>
	<td>25</td>
</tr>
<tr>
    <td>张三</td>
	<td>男</td>
	<td>25</td>
</tr>
</table>

也就是如下HTML效果：

姓名 姓别 年龄
张三 男 25
张三 男 25
张三 男 25

TH(fields:PoolStringArray) -> String

用fields指定的字段生成HTML表格的表头部分。

TH(["姓名","姓别","年龄"])

生成的HTML代码如下：

<tr>
    <th>姓名</th>
	<th>姓别</th>
	<th>年龄</th>
</tr>

注意：创建HTML表格可以直接使用table()方法。

TR(vals:PoolStringArray) -> String

用vals指定的值列表生成HTML表格的一行。

TR(["张三","男","25"])

生成的HTML代码如下：

<tr>
    <td>张三</td>
	<td>男</td>
	<td>25</td>
</tr>

注意：创建HTML表格可以直接使用table()方法。

input_text(name:String = “”,size:int=0,maxlength:int=0) -> String

生成input[text]表单元素。

input_password(name:String = “”) -> String

生成input[password]表单元素。

input_checkbox(name:String = “”,checked:bool = false) -> String

生成input[checkbox]表单元素。

input_radio(name:String = “”,checked:bool = false) -> String

生成input[radio]表单元素。

input_submit(value:String = “确定”) -> String

生成input[submit]表单元素。

input_reset(value:String = “清空”) -> String

生成input[reset]表单元素。

input_hidden(value:String = “”) -> String

生成input[hidden]表单元素。

input_option(string:String = “”,selected:bool = false) -> String

生成option标签，用于select标签的选项。

input_select(name:String = “”,options:PoolStringArray = []) -> String

生成select标签。

input_textarea(name:String = “”,string:String = “”,rows:int = 0,cols:int =0) -> String

生成textarea标签。

form(inputs_str:String = “”,action:String = “”,method:String = “”) -> String

生成form标签。

saveString(path:String,content:String) -> void

保存字符串到指定路径的文件。函数库内快速保存纯文本文件的快捷函数。

get_date_time() -> String

返回当前日期时间。函数库内快速获得当前日期时间的快捷函数。

源代码

这里是完整源代码：

# =======================================
# H5Creator - HTML快速生成 - 函数库
# 2022年9月25日10:57:49
# @巽星石
# 说明：本函数库基于HTML5所支持的语法进行创建
#      H5页面基础框架以VScode生成的框架为基础
# =======================================


class_name H5Creator

# ================== 底层函数 ==================

# 闭合标签 - 返回一对闭合标签 - <tag[attrs]>string</tag>
static func double_tag(tag:String,string:String = "",attrs:String = "") -> String:
	var htm_str = "<%s%s>%s</%s>\n" % [tag,(" " + attrs if attrs!="" else ""),string,tag]
	return htm_str

# 单标签 - 返回一个自闭合标签 - <tag[attrs] />
static func single_tag(tag:String,attrs:String = "") -> String:
	var htm_str = "<%s%s />\n" % [tag,(" " + attrs if attrs!="" else "")]
	return htm_str

# HTML5页面基础框架
static func H5_page(
					title:String,
					js:String = "",
					css:String = "",
					css_links:PoolStringArray = [],
					js_links:PoolStringArray = [],
					body:String = ""
													) -> String:
	# 外部链接的脚本和CSS样式文件
	var script_link = "<script src='%s'></script>\n"
	var css_link = "<link rel='stylesheet' href='%s'>\n"
	# 所有传入的外部CSS链接
	var css_links_str = ""
	if css_links.size()>0:
		for cs_link in css_links:
			css_links_str += css_link % cs_link
	# 所有传入的外部脚本链接
	var js_links_str = ""
	if js_links.size()>0:
		for js_link in js_links:
			js_links_str += script_link % js_link
	# 内置的脚本和CSS样式
	var script = ("<script>\n%s\n</script>" % js) if js != "" else ""
	var style = ("<style>\n%s\n</style>" % css) if css != "" else ""
	
	var H5_tpl = """
<!DOCTYPE html>
<html lang='zh_CN'>
<head>
	<meta charset='UTF-8'>
	<meta http-equiv='X-UA-Compatible' content='IE=edge'>
	<meta name='viewport' content='width=device-width, initial-scale=1.0'>
	<title>[title]</title>
	[css_links]
	[script_links]
	[style]
	[script]
</head>
<body>
	[body]
</body>
</html>
"""
	H5_tpl = H5_tpl.replace("[title]",title)
	H5_tpl = H5_tpl.replace("[css_links]\n",css_links_str + "\n" if css_links_str !="" else "")
	H5_tpl = H5_tpl.replace("[script_links]\n",js_links_str + "\n" if js_links_str !="" else "")
	H5_tpl = H5_tpl.replace("[style]\n",style + "\n" if style !="" else "")
	H5_tpl = H5_tpl.replace("[script]",script if script !="" else "")
	H5_tpl = H5_tpl.replace("[body]",body if body !="" else "")
	return H5_tpl
	

# ================== 基础库 - 单标签函数 ==================
# H1-H6
static func H(level:int,title:String) -> String:
	level = clamp(level,1,6)
	return double_tag("h%s" % level,title)

# 段落 - <p>content</p>
static func P(content:String) -> String:
	return double_tag("p",content)


# 超链接 - <a href=[url]>title</a> | <a href=[url]>[url]</a>
static func A(url:String = "",title:String = "") -> String:
	var ctn = title if title != "" else url
	var attr = ("href='%s'" % url) if (url !="") else ""
	return double_tag("a",ctn,attr)

# 图片 - <img src='[url]' />
static func img(url:String) -> String:
	return single_tag("img",("src='%s'" % url) if (url !="") else "")

# OL - 有序列表
static func OL(str_list:PoolStringArray) -> String:
	var return_str = ""
	var ol_str = "<ol>\n%s</ol>\n"
	var li_str = "<li>%s</li>\n"
	for i in str_list.size():
		 return_str += li_str % str_list[i]
	return_str = ol_str % return_str
	return  return_str

# UL - 无序列表
static func UL(str_list:PoolStringArray) -> String:
	var return_str = ""
	var ul_str = "<ul>\n%s</ul>\n"
	var li_str = "<li>%s</li>\n"
	for i in str_list.size():
		 return_str += li_str % str_list[i]
	return_str = ul_str % return_str
	return  return_str

# HR - 水平分隔线
static func HR() -> String:
	return "<hr />"

# BR - 强制换行
static func BR() -> String:
	return "<br />"


# table - 表格
static func table(fields:PoolStringArray,rows:Array) -> String:
	var th = TH(fields)
	var trs = ""
	for row in rows:
		trs += TR(row)
	return double_tag("table",th + trs,"border=0")


# 表格 - 表头
static func TH(fields:PoolStringArray) -> String:
	var tr = double_tag("tr","%s")
	var ths = ""
	for fd in fields:
		ths +=  double_tag("th","%s") % fd
	tr = tr % ths
	return tr
	
# 表格 - 行
static func TR(vals:PoolStringArray) -> String:
	var tr = double_tag("tr","%s")
	var tds = ""
	for val in vals:
		tds +=  double_tag("td","%s") % val
	tr = tr % tds
	return tr

# === 表单元素 === 
# input[text] - <input type='text'[name][size][maxlength] />
static func input_text(name:String = "",size:int=0,maxlength:int=0) -> String:
	var ipt_text:String = single_tag("input","type='text'[name][size][maxlength]")
	ipt_text = ipt_text.replace("[name]"," name='%s'" % name if name != "" else "")
	ipt_text = ipt_text.replace("[size]"," size='%s'" % size if size != 0 else "")
	ipt_text = ipt_text.replace("[maxlength]"," maxlength='%s'" % maxlength if maxlength != 0 else "")
	return ipt_text

# input[password] - <input type='password'[name] />
static func input_password(name:String = "") -> String:
	var ipt_text:String = single_tag("input","type='password'[name]")
	ipt_text = ipt_text.replace("[name]"," name='%s'" % name if name != "" else "")
	return ipt_text

# input[checkbox] - <input type='checkbox'[name][checked] />
static func input_checkbox(name:String = "",checked:bool = false) -> String:
	var ipt_text:String = single_tag("input","type='heckbox'[name][checked]")
	ipt_text = ipt_text.replace("[name]"," name='%s'" % name if name != "" else "")
	ipt_text = ipt_text.replace("[checked]"," checked='checked'" if checked else "")
	return ipt_text

# input[radio] - <input type='radio'[name][checked] />
static func input_radio(name:String = "",checked:bool = false) -> String:
	var ipt_text:String = single_tag("input","type='radio'[name][checked]")
	ipt_text = ipt_text.replace("[name]"," name='%s'" % name if name != "" else "")
	ipt_text = ipt_text.replace("[checked]"," checked='checked'" if checked else "")
	return ipt_text
	
# input[submit] - <input type='submit' value='[value]' />
static func input_submit(value:String = "确定") -> String:
	return single_tag("input","type='submit' value='%s'" % value)

# input[reset] - <input type='reset' value='[value]' />
static func input_reset(value:String = "清空") -> String:
	return single_tag("input","type='reset' value='%s'" % value)

# input[hidden] - <input type='hidden' value='[value]' />
static func input_hidden(value:String = "") -> String:
	return single_tag("input","type='hidden' value='%s'" % value)

# select>option - <option[selected]>string</option>
static func input_option(string:String = "",selected:bool = false) -> String:
	var opt_text:String = double_tag("option","%s","[selected]")
	opt_text = opt_text % string
	opt_text = opt_text.replace("[selected]"," selected='selected'" if selected else "")
	return opt_text

# select
# - <select[name]>
# - [options]
# - </select>
static func input_select(name:String = "",options:PoolStringArray = []) -> String:
	var sel_text:String = double_tag("select","%s","[name]")
	sel_text = sel_text.replace("[name]","name='%s'" % name if name != "" else "")
	var options_str = ""
	if options.size() >0:
		for opt in options:
			options_str += input_option(opt)
	sel_text = sel_text % options_str
	return sel_text


# textarea - <textarea[name][rows][cols]>string</textarea>
static func input_textarea(name:String = "",string:String = "",rows:int = 0,cols:int =0) -> String:
	var txt_text:String = double_tag("textarea","\n%s\n" % string,"[name][rows][cols]")
	txt_text = txt_text.replace("[name]","name='%s'" % name if name != "" else "")
	txt_text = txt_text.replace("[rows]"," rows='%s'" % rows if rows != 0 else "")
	txt_text = txt_text.replace("[cols]"," cols='%s'" % cols if cols != 0 else "")
	return txt_text

# form - <form[action][method]>\n[inputs_str]\n</form>
static func form(inputs_str:String = "",action:String = "",method:String = "") -> String:
	var form_text:String = double_tag("form","\n%s\n" % inputs_str,"[action][method]")
	form_text = form_text.replace("[action]","action='%s'" % action if action != "" else "")
	form_text = form_text.replace("[method]"," method='%s'" % method if method != "" else "")
	return form_text


# =================== 额外需要的函数 ====================

# 保存字符串到指定路径的文件
static func saveString(path:String,content:String) -> void:
	var file = File.new()
	file.open(path,File.WRITE)
	file.store_string(content) # 整体存储
	file.close()
	
# 返回当前日期时间
static func get_date_time() -> String:
	return Time.get_datetime_string_from_system().replace("T"," ")

猜你喜欢

转载自blog.csdn.net/graypigen1990/article/details/127039441
今日推荐
中国码农的“35岁魔咒”
蘭雅 CorelDRAW 插件 2024.5.1 国际劳动节版，免费下载
Arc Browser for Windows 1.0 正式 GA
90后程序员开发视频搬运软件、不到一年获利超 700 万，结局很刑！
《美国对全球网络空间安全与发展的威胁和破坏》报告发布
周排行
Java基础复习_day13_Collection集合
2018.11.16 c语言学习经验
且看Java内置四大核心函数式接口
小程序云开发中数据库的数据分段和显示图片
python的函数
Web-JS进阶
【干货】C++常用代码积累笔记大全
Spring的ioc操作 与 IOC底层原理
构建之法20191121-11 Scrum立会报告+燃尽图 07
Spring boot之Hello World访问404
每日归档
更多
2024-05-05(0)
2024-05-04(7)
2024-05-03(19)
2024-05-02(0)
2024-05-01(4)
2024-04-30(1)
2024-04-29(40)
2024-04-28(0)
2024-04-27(56)
2024-04-26(39)

代码天地 © 2018 codetd.com

境外服务器   最新电视剧2022