处理的步骤:
1、将文本转换为全角字符;
2、生成一个网格,放到二维数组中;
3、将文字替换到二维数组相应的位置;
4、将二维数组处理成字符串。 使用方法参考这里历史的博文。 ╔═╤═╤═╤═╤═╤═╤═╤═╤═╤═╤═╤═╤═╤═╤═╤═╤═╤═╗
║ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │
在│
颜║
║ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │
脚│
色║
║ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │
本│
、║
║ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │
里│
高║
║ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │
调│
、║
║ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │
。│
宽║
║ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │
可║
║ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │
以║
║ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │
自║
║ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │
己║ ╚═╧═╧═╧═╧═╧═╧═╧═╧═╧═╧═╧═╧═╧═╧═╧═╧═╧═╝
function SBCCase(text)
{
var text = text.replace(/[/r/n]+/img, " ");
var chars = " !"#¥%&'()*+,-./0123456789:;<=>?@" +
"ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`" +
"abcdefghijklmnopqrstuvwxyz{|} ̄";
var result = "";
for (var i = 0; i < text.length; i++)
{
var unicode = text.charCodeAt(i);
if (unicode >= 32 && unicode <= 126)
result += chars.charAt(unicode - 32);
else result += text.charAt(i);
}
return result;
}
function GridBuilder(colCount, rowCount, gridColor)
{
var gridChars = " ╔╤╗╚╧╝═║│";
var result = new Array();
for (var row = 0; row < rowCount; row++)
{
if (row == 0)
{
var temp = new Array();
var char = gridChars.charAt(1);
if (typeof(gridColor) != "undefined")
var char = "[color=" + gridColor + "]" + char;
temp.push(char);
for (var col = 1; col < colCount; col++)
{
temp.push(gridChars.charAt(7));
temp.push(gridChars.charAt(2));
}
temp.push(gridChars.charAt(7));
var char = gridChars.charAt(3);
if (typeof(gridColor) != "undefined")
var char = char + "[/color]";
temp.push(char);
result.push(temp);
}
var temp = new Array();
var char = gridChars.charAt(8);
if (typeof(gridColor) != "undefined")
var char = "[color=" + gridColor + "]" + char + "[/color]";
temp.push(char);
for (var col = 1; col < colCount; col++)
{
temp.push(gridChars.charAt(0));
var char = gridChars.charAt(9);
if (typeof(gridColor) != "undefined")
var char = "[color=" + gridColor + "]" + char + "[/color]";
temp.push(char);
}
temp.push(gridChars.charAt(0));
var char = gridChars.charAt(8);
if (typeof(gridColor) != "undefined")
var char = "[color=" + gridColor + "]" + char + "[/color]";
temp.push(char);
result.push(temp);
if (row == rowCount - 1)
{
var temp = new Array();
var char = gridChars.charAt(4);
if (typeof(gridColor) != "undefined")
var char = "[color=" + gridColor + "]" + char;
temp.push(char);
for (var col = 1; col < colCount; col++)
{
temp.push(gridChars.charAt(7));
temp.push(gridChars.charAt(5));
}
temp.push(gridChars.charAt(7));
var char = gridChars.charAt(6);
if (typeof(gridColor) != "undefined")
var char = char + "[/color]";
temp.push(char);
result.push(temp);
}
}
return result;
}
function GridText(grid)
{
var result = "";
for (var i = 0; i < grid.length; i++)
result += grid[i].join("") + "/r/n";
return result;
}
function GridFull(colCount, rowCount, text, gridColor, textColor, left2right)
{
if (colCount <= 0) return "";
if (rowCount <= 0) return "";
var result = "";
var text = SBCCase(text);
var grid = null;
for (var i = 0; i < text.length; i++)
{
if (!grid) grid = GridBuilder(colCount, rowCount, gridColor);
var j = i % (colCount * rowCount);
var row = j % rowCount;
var col = Math.floor(j / rowCount);
var char = text.charAt(i);
if (typeof(textColor) != "undefined")
var char = "[color=" + textColor + "]" + char + "[/color]";
if (typeof(left2right) != "undefined" && left2right)
grid[row + 1][col * 2 + 1] = char;
else grid[row + 1][(colCount - col) * 2 - 1] = char;
if ((i + 1) % (colCount * rowCount) == 0 )
{
result += GridText(grid) + "/r/n";
grid = null;
}
}
if (grid) result += GridText(grid);
return result;
}
var colCount = 18;
var rowCount = 10;
var left2right = false;
var gridColor = undefined/*"#808080"*/;
var textColor = "#FF0000";
function getEditor()
{
var replyframe = parent.document.getElementById("replyframe");
if (replyframe)
return replyframe.contentWindow.document.getElementById("tb_ReplyBody___Editor");
else
return document.getElementById("ctl00_ctl00_CPH_Content_CPH_BaseContent_tb_TopicBody___Editor");
}
function setEditorText(value)
{
var editor = getEditor();
if (editor)
{
editor.value = value;
editor.focus();
}
}
function getEditorText()
{
var editor = getEditor();
if (editor) return editor.value;
}
function setGrid()
{
setEditorText(GridFull(colCount, rowCount, getEditorText(), gridColor, textColor, left2right));
}
setGrid();
分享到:
相关推荐
1. 包里包含源码和一个测试用例,可直接看到效果。 2. 竖排文字的一些说明,移步以下链接 https://blog.csdn.net/piaoyun29/article/details/123255514
arcgis maplex竖排文字,是我自己截图总结的
文本框文字竖排
竖排汉字编辑的类。可以在文本框中生成竖排的文字。
C#203文字竖排工具,源代码
前段时间看竖排文字挺流行的,就自己动手写了一个java版的,给自己用,现在拿出来和大家一起研究下!
此工具可以把普通横排文字转换为古典的中文直排模式,由右至左的方式显示,并且增加适当的线标,方便读者阅读。您可以在论坛、博客发言之前用这个工具把要发表的文章转化,然后再粘贴到要发表的论坛、博客上去。有了...
#功能:竖排文字 通过模板图片 写入文字到指定位置,并分别保存成新的图片 #功能说明:根据","换行(也可以根据"\n"换行) #环境:PyDev 6.5.0 Python3.5.2
android利用Paint在Canvas上实现竖排写字
实现文字竖向排列的一个winform编辑器,自已一点点写的,自测可用
一款可以自动居中显示的竖排文字弹出层;js+jquery写成的拿去就可以直接用
合成图片应该按照 Canvas 的文档来做都没什么问题,主要是有个竖排文字的需求,这里和大家分享一下。 正文 首先放一张最终保存到相册的图片吧~ 自我感觉良好,至少达到了我自己的预期吧~~~ 下面让我们一步一步来...
ZBLOG 竖排文字插件for z-blog
类似公交站牌的文字竖排效果,支持响应点击事件,样式定制,如果要滑动,可以结合Scroll(垂直滑动)或者HorizontalScrollView(水平滑动)或者Scroll+ HorizontalScrollView(上下左右)使用实现滑动
合成图片应该按照 Canvas 的文档来做都没什么问题,主要是有个竖排文字的需求,这里和大家分享一下。 正文 首先放一张最终保存到相册的图片吧~ (此图片来源于网络,如有侵权,请联系删除! ) 自我...
网页文字竖排三法,爱好文字特效的网页制作者的最爱
不用另外的子题库,将LineChart的文字进行竖排,很简单的例子
NULL 博文链接:https://hnicypb.iteye.com/blog/293250
css实现文字竖排效果
自定义textview 实现字体竖排效果