几年前刚毕业.第一个游戏模块做的就是聊天.到如今.几个游戏写过几次聊天模块. 之前在4399做的<幻龙骑士>(又名<神骑士>),还有上周六刚上线的<疯狂的子弹>, 用的是同一套代码,聊天输入框没有图文混排,而是用符号取代,输出面板才有图文混排. 输出面板的图文混排因为内容没有键鼠操作.实现非常easy,不在本文讨论之列:当然本 文的代码中抽出一小部分就能够实现了.以上两款游戏没有加密,有兴趣的能够去弄来看看. <子弹>里面的键鼠.技能.射击.弹道搞得好累人啊…
原文链接 图文混排也是FLASH里一个很古老的话题了,我们不像美国佬那样游戏里面聊天框就是聊天框,全是文字干干净净,也不像日本人发明了并且频繁地使用颜文字.不管是做论坛.做游戏,必定要实现的一点就是带表情对话框. 闲话扯多了,直接进入正题把. 1.TextField 首先,使用TextField的情况下 要想在使用TextField的前提下实现图文混排,一般比较流行的有2种实现方法: 第一种是使用HTML标签,textfield支持简单的HTML标签,比如<img>.<a>等等,在…
昨天参加一个面试,面试官让当场写一个类似于新闻列表的页面,文本数据和图片都从网络上获取,想起我还没写过ListView异步加载图片并实现图文混排效果的文章,so,今天就来写一下,介绍一下经验. ListView加载文本数据都是很简单的,即使是异步获取文本数据.但是异步加载图片就稍微有一点麻烦,既要获得一个比较好的用户体验,还要防止出现图片错位等各种不良BUG,其实要考虑的东西还是挺多的.好了,我们先来看一下我们今天要实现的一个效果图: 看起来似乎并不难,确实,我们今天的核心问题只有一个,就是怎么…
  图文混排流程图.graffle4.8 KB   下面附上图片素材: 表情.zip692.5 KB     下面是字符串与图片的详细对应关系:                 "[呲牙]"字符串对应于图片名    f000.gif;        "[调皮]"字符串对应于图片名    f001.gif;        "[流汗]"字符串对应于图片名    f002.gif;        "[偷笑]"字符串对应于图片名   …
iOS7以后,因为TextKit的强大,可以用NSAttributedString很方便的实现图文混排(主要是利用了NSTextAttachment). 关于Textkit的牛逼之处,可以参考objcio上的文章(https://objccn.io/issue-5-1/) 我用NSAttributedString仿写了一个知乎的输入框(低仿,就是有个功能而已),效果如图: demo在这里:(https://github.com/Phelthas/TEST_XMLCommon   的第四个)  …
Unity UGUI图文混排源码(一):http://blog.csdn.net/qq992817263/article/details/51112304 Unity UGUI图文混排源码(二):http://blog.csdn.net/qq992817263/article/details/51112311 为了方便整理,申请了一个专栏,链接:Unity UGUI图文混排专栏 图文混排解决方案二: 通过继承Text组件来获取文字的UIVertex并得到他的位置,通过Text富文本的<quad…
目前在unity实现图文混排的好像都是通过自定义字体然后在文本获取字符的位置,用图片替换掉图片标签,这样对于支持英文来说,并没有什么影响.然后对于中文来说就是一个相当麻烦的事了,毕竟图文混排多用于游戏聊天,这样就需要将中文的所有常用汉字都添加进去,想想都不怎么科学 于是我就想在ugui自带的Text组件的基础上,实现图文混排,花了一点时间,也算有点成果了 整理一下,实现图文混排的步骤: 准备了一些图片,并制作了一个asset文件,将所有图片的信息保存进去,方便调用 写了一个SpriteGraph…
参考链接: https://github.com/SylarLi/RichText/tree/master/Assets/Scripts 正则表达式: https://blog.csdn.net/lyh916/article/details/49201195 图文混排主要用于聊天,其实就是传输某种格式的字符串,然后解析这个字符串,生成表情文字等.图文混排的第一步,就是确定好格式,这里使用html的标签格式,对于代码中出现的start和end字段可以先忽略.标签格式如下: <material=un…
参考: Laya图文混排 Laya的图文混排教程 编辑模式F9,增加laya.html.js库 在层级窗口右键,添加一个HtmlDivElement组件 大致的原理: 1. 例如输入框的字符串是 "大家好!很高兴认识大家!@1@", "@1@"为一个表情的代号.下图直接使用str当成输入框文字. 2. 操作str字符串,全局搜索"@1@",将该表情代号换成表情图片<img>的标签. 3. 将str字符串赋值给HTMLDivElemen…
常见的在一些微博微信中可以看见一段文字中有不同的字体,字体有不同的颜色,并且可能会有一些笑脸之类的表情,这些可以通过图文混排做到. 图文混排可以通过WebView和CoreText做到,其他还有别的方法暂不去讲,我也还没学到. WebView相对简单,直接将链接load过来就可以了,但对设备要求较高. CoreText相对底层,也就相对高效,也就相对复杂. 举个简单的例子: 例如设置一个UILab,要求其中显示“hello world”: UILabel *label = [[UILabel a…
不少人为了让 Div 图文混排的图片可以居中,给 IMG 套各式各样的 SPAN.DIV.LI 等等,以便于使用 text-align来进行居中. <div>图文混排 <br> <span style="text-align:center"><img src="http://www.baidu.com/img/baidu_jgylogo3.gif"></span> </div> 而对于 DIV…
图文混排的形式 1. 富文本形式 2. core Text(文字排版) 3. TextKit 4. UIWebView 一.富文本 我们可以采用attributeString来进行图文混排.例如一个文字上插入一个图片.实现如下: NSString *content = @"文字加上表情[得意][酷][呲牙]"; NSMutableAttributedString *attrStr = [Utility emotionStrWithString:content]; _firstLabel…
CoreText是iOS3.2推出的一套文字排版和渲染框架,可以实现图文混排,富文本显示等效果. CoreText中的几个重要的概念:  CTFont CTFontCollection CTFontDescriptor CTFrame CTFramesetter CTGlyphInfo CTLine CTParagraphStyle CTRun CTTextTab CTTypesetter 先来了解一下该框架的整体视窗组合图: CTFrame 作为一个整体的画布(Canvas),其中由行(CTL…
iOS没有现成的支持图文混排的控件,而要用多个基础控件组合拼成图文混排这样复杂的排版,是件很苦逼的事情.对此的解决方案有使用CoreText进行绘制,或者使用TextKit.本文主要讲解对于CoreText的使用. 案例下载地址 https://github.com/ClavisJ/CoreTextDemo 环境信息: Mac OS X 10.10.1 Xcode 6.1.1 iOS 8.1 正文: 一.Core Text简介 CoreText是基于IOS3.2及OSX10.5的用于文字精细排版…
下面就具体说一下我遇到的问题,首先是EditText里面的图文混排问题,这个问题的难点就是三点: 1.怎么插图片 2.怎么保存插入的图片和文字 3.怎么解析回图片和文字 解决: 一.怎么插入图片 在这里定义了两个Button按钮和一个EditText,插入图片的话,就是点击插入图片按钮然后从sd卡中选择一张图片出来.下面是实现代码: 首先是button的监听事件: btn_insertImage.setOnClickListener(new OnClickListener() { @Overri…
用UITextView实现图文混排效果的展示,首先要禁用UITextView的编辑功能,将属性editable设置为NO 1.首先创建一个NSTextAttachment对象,这个对象有一个image属性,可以将需要显示的图片赋值给这个属性 NSTextAttachment *attachment = [[NSTextAttachment alloc] init]; attachment.image = [UIImage imageNamed:@"imageName"]; 2.将att…
功能:图文混排,可自动缩放字体,如图: 单点触控使用的代码来自:http://blog.csdn.net/xiaanming/article/details/42833893  谢谢博主! 在该demo中只是将bitmap改为了显示图文混排的效果,不足之处,请大家指正,共同进步! 贴上2个重要的方法: private void MeasureBitmapTextSize(HSpannableString htr) //计算图文内容需要的bitmap高宽以及对应的字体大小 { //根据字体大小重新…
制作字体过程 首先得下载一个位图制作工具Bitmap font generator,可以点击这里下载 1.新建txt文件,输入字体里面包含的文字 2.保存为utf-8格式:点击文件另存为,选择编码格式为UTF-8 3.打开下载的bitmap font软件,选择options->font settings,设置字体等选项 4.选择Edit->select chars from file,然后选择我们刚刚建好的文件 5.选择options->save bitmapfont as .然后就会生…
项目开发中需要实现这种效果 多余两行,两行最后是省略号,省略号后面是下拉更多 之前用过的是Html.fromHtml去处理图文混排的,仅仅是文字后图片或者文字颜色字体什么的, 但是这里需要在最后文字的省略号后面添加图片. 直接上代码吧,代码注释很多,慢慢研究 private void toggleEllipsize(final TextView tv,final String desc){ if(desc == null){ return; } tv.getViewTreeObserver().…
About GallopGallop是一个功能强大.性能优秀的图文混排框架. Features主要用于解决以下需求: 滚动列表的性能优化.Gallop使用异步绘制.视图层级合并.观察mainRunloop.对布局模型预先缓存等方法,能在实现复杂的图文混排界面时,仍然保持一个相当优秀的滚动性能(FPS基本保持在60). 项目内有使用Gallop构建的微信朋友圈Demo 实现图文混排界面,比如在文本中添加表情,对文字添加点击链接.Gallop还提供了方便的方法可以直接完成表情.URL链接.@用户.#…
先看下效果图: 上面是MTextView,下面是默认的TextView. 一.原因 用最简单的全英文句子为例,如果有一个很长的单词,这一行剩余的空间显示不下了,那么规则就是不打断单词,而是把整个单词丢到下一行开始显示.这样 本来没有错.一是咱们中国人都是方块字,怎么都放得下,不存在英文的这个问题.所以不习惯那个排版.二是如果TextView里面有图片,如图,不知道判断单词的代码是怎么弄得,总之它觉得最后一个啦字和后面的一串表情应该是一个整体,不能分开,就一起丢到第二行了,也就造成了这种难看的排版…
CoreText实现图文混排之点击事件 主要思路 我们知道,CoreText是基于UIView去绘制的,那么既然有UIView,就有 -(void)touchesBegan:(NSSet<UITouch *> )touches withEvent:(UIEvent )event方法,我们呢,就是基于这个方法去做点击事件的. 通过touchBegan方法拿到当前点击到的点,然后通过坐标判断这个点是否在某段文字上,如果在则触发对应事件. 上面呢就是主要思路.接下来呢,我们来详细讲解一下.还是老规矩…
CoreText 实现图文混排 相关博文推荐 IOS CoreText.framework - 基本用法 IOS CoreText.framework - 段落样子CTParagraphStyle http://blog.csdn.net/fengsh998/article/details/8701738 IOS CoreText.framework - 图文混排 demo下载 本文所涉及的代码你可以在这里下载到 https://github.com/kejinlu/CTTest,包含两个项目,…
http://blog.csdn.net/xujunfeng000/article/details/36399339?utm_source=tuicool&utm_medium=referral TextView本身是支持图文混排的,在手机上,通过TextView进行图文混排时,排版可能难以达到PC上浏览器的效果,特别是对于一些支持多种标签的发布系统. 1. 网上很容易找到的使用TextView实现图文混排的例子,大多是类似于下面的形式: TextView tv_Content; tv_Cont…
今天呢,我们继续把CoreText图文混排的点击事件补充上,这样我们的图文混排也算是圆满了. 哦,上一篇的链接在这里 http://www.jianshu.com/p/6db3289fb05d CoreText实现图文混排.所有需要用到的准备知识都在上一篇,没有赶上车的朋友可以去补个票~ 上正文. CoreText做图文混排之点击事件 主要思路 我们知道,CoreText是基于UIView去绘制的,那么既然有UIView,就有 -(void)touchesBegan:(NSSet)touches…
在一些项目中,我们需要自定义自己的UIButton,使Button上面同时具有图片和文字描述,实现自定义UIButton的图文混排. 首先我们需要定义一个继承自UIButton的类,同时实现自己的initWithFrame:方法.方法声明在这个类的头文件中. self = [super initWithFrame:frame]; if (self) { } return self; 在if判断语句中,我们可以实现对按钮的一些自定义属性和方法,如按钮圆角.Title文本.背景颜色等信息. 如 se…
在很多新闻类或有文字展示的应用中现在都会出现图文混排的界面例如网易新闻等,乍一看去相似一个网页,其实这样效果并非由UIWebView 加载网页实现.现在分享一种比较简单的实现方式 iOS sdk中为我们提供了一套完善的文字排版开发组件:CoreText.CoreText库中提供了很多的工具来对文本进行操作,例如CTFont.CTLine.CTFrame等.利用这些工具可以对文字字体每一行每一段落进行操作. 此例中默认图片都在右上方,且为了美观和开发简便设定所占宽度都相同. 1.        …
项目开发需要达到这种效果 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvZmFuY3lsb3ZlamF2YQ==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt=""> 多余两行,两行最后是省略号,省略号后面是下拉很多其它 之前用过的是Html.fromHtml去处理图文混排的,不过文字后图片或者文字颜色字体什么的.…
photoshop中无法象word中自动图文混排,但可以通过手工绘制路径完成图文混排. 如下图,先摆放图像,然后绘制路径,然后在路径中输入或粘贴文字即可.…
之前更新超链接的时候,忘了搭配实现一个下划线的功能,这篇文章就是来补上这一个功能,时间有点长,一方面没有很好的思路,一方面也没多少时间. 先在网上收集了一下下划线的实现操作,一种是在文本下再创建一个文本用来输入下划线,一种是在文本下再创建一个图片用来绘制下划线,这两种方式都相当容易理解,最开始都在考虑是否集成这两种方式,但是这里确实不适合应用到图文混排中,不断的生成资源,会大大地消耗性能. 最后,在参考前面的下划线的时候,想到只要自己将下划线的顶点数据获取到,更改为我们所需要的位置,添加到Tex…