首页 > 其他分享 >egret图文混排

egret图文混排

时间:2024-10-23 13:42:20浏览次数:1  
标签:egret invalidate val text component width 图文混排 ._

class TextImage extends eui.Group {
       public templet: egret.TextField
       constructor(protected _TextImageData: Array<any> = []) {
           super();
           this.init()
       }
       set TextImageData(val: Array<any>) { this._TextImageData = val; this.init(); }
       get TextImageData() { return this._TextImageData }
       _size = 36
       /**设置文字字体大小 */
       set size(val: number) {
           this._size = val
       }
       get size(): number {
           return this._size
       }
       private _width: number;
       /**设置宽度 */
       set width(val) { this._width = val; this.invalidate(); }
       get width() { return this._width };
       private _verticalAlign = egret.VerticalAlign.MIDDLE;
       /**设置vercatical */
       set verticalAlign(val) { this._verticalAlign = val; this.invalidate(); }
       get verticalAlign() { return this._verticalAlign };
       _maxWidth: number
       /**设置组件的最大宽度 */
       set maxWidth(val: number) {
           this._maxWidth = val
           if (this.templet.width > val) {
               this.width = val
               this.invalidate()
           }
       }
       get maxWidth(): number {
           return this._maxWidth
       }
       private _lineSpacing = 0
       /**设置组件的行间距 */
       set lineSpacing(val: number) {
           if (this._lineSpacing === val) return
           this._lineSpacing = val
           this.invalidate()
       }
       get lineSpacing(): number {
           return this._lineSpacing
       }
       /**立即计算布局 */
       validateNow() {
           this.init()
           this.invalidate_Flag = false
       }
       /**组件的每行高度 */
       lineHeightArray: Array<number> = []
       components: any[] = []
       protected init() {
           this.removeChildren()
           if (this._TextImageData.length == 0) {
               this.width = this.height = 0
               return
           }
           // 保存组件,清除事件绑定
           this.components = []
           this._TextImageData.forEach(component => {
               if (typeof component == 'object') {
                   this.components.push(component)
                   if (!component['watch']) {
                       egret.is(component, 'eui.Image') && component.once(egret.Event.COMPLETE, this.invalidate, this)
                       eui.Watcher.watch(component, ['width'], this.invalidate, this)
                       eui.Watcher.watch(component, ['height'], this.invalidate, this)
                       component['watch'] = true
                   }
               }
           })
           let textFlow = this._TextImageData.map(text =>
               typeof text === "string" || egret.is(text, 'eui.Label')
                   ? { text: egret.is(text, 'eui.Label') ? text.text : text }
                   : { text: '樂', style: { size: text.width } }
           )
           let TextField: egret.TextField = this.templet = new egret.TextField();
           TextField.size = this.size;
           TextField.lineSpacing = 0;
           TextField.width = this.width
           TextField.textFlow = textFlow
           TextField.height = TextField.height
           this.height = 0
           this.lineHeightArray = []
           let componentTestIndex = 0 //测量高度的组件序号
           let componentIndex = 0 //布局的组件序号
           TextField['linesArr'].forEach((item,lines) => {
               console.log('item=>', item)
               //获取最大高度
               let maxheight = this.size
               //组件序号
               item.elements.forEach((element) => {
                   if (element.text == '樂') {
                       let c = this.components[componentTestIndex++]
                       maxheight = Math.max(maxheight, c.height)
                   }
               })
               maxheight = this._lineSpacing + maxheight
               this.lineHeightArray.push(maxheight)
               //开始布局
               let x = 0
               item.elements.forEach(element => {
                   let component
                   if (element.text !== '樂') {
                       component = new egret.TextField()
                       component.x = x
                       component.size = this.size
                       component.text = element.text
                       component.width = element.width
                       component.textColor = this._textColor
                       component.height = maxheight
                       component.y = this.height
                       component.verticalAlign = this._verticalAlign;
                   } else {
                       component = this.components[componentIndex++]
                       component.x = x
                       component.y = this.height + (maxheight - component.height) / 2
                   }
                   x += component.width
                   this.addChild(component)
               })
               this.height += maxheight
           })
           this._width = this.templet.width
       }
       _textColor: number = 0x000000
       set textColor(val) {
           this._textColor = val
           this.invalidate()
       }
       get textColor() {
           return this._textColor
       }
       /**失效验证 */
       private invalidate_Flag: boolean = false
       private invalidate(e?: egret.Event): void {
           if (this.invalidate_Flag) {
               return
           }
           this.invalidate_Flag = true
           this.once(egret.Event.ENTER_FRAME, () => {
               this.init()
               this.invalidate_Flag = false
           }, this);
       }
   }

  

标签:egret,invalidate,val,text,component,width,图文混排,._
From: https://www.cnblogs.com/lichuangblog/p/18496201

相关文章

  • Unity使用TextMeshPro实现聊天图文混排
    本文来自:https://developer.aliyun.com/article/10666231.文字自适应问题。2.图文混排问题。UI界面1.创建滑动列表首先创建一个可以上下滑动的列表,命名为chat_scroll2.创建聊天预制因为聊天是两人以上的,自己的聊天显示在右侧,别人的聊天消息显示在左侧。因此需要制作两个聊天......
  • WORD图文混排复制到XHEDITOR图片不显示
    编辑器:xhEditor前端:vue2,vue3,vue-cli,html5后端:asp,php,jsp,springboot,asp.net,.netcore功能:复制粘贴word内容图片,要求:免费,开源,技术支持最近搞定块挻火的,今天早上又有网友加我微信私聊,也是想了解这块的技术和方案。昨天晚上论坛里面的一个网友给我发私信,想了解一下如何解......
  • OI Memory: No Regrets
    其实感觉没什么可以写的啊。我从小学四年级开始接触OI,最开始是在培训机构里学了一年半。刚起步的时候当然是学得很快的,到进入初中的时候,已经差不多把基础算法学完了。五年级的时候,我参加了ZL的提前招。那时这所学校已经在MO上颇有名气,同时也开始在OI方面崭露头角。经过一......
  • 【思考模型框架】使用遗憾最小化框架(Regret Minimization Framework),帮助决策者以一种
    一、遗憾最小化框架的定义遗憾最小化框架,是一种决策理论。遗憾最小化框架,是一种决策制定策略。遗憾最小化框架,是一种实用的决策工具。遗憾最小化框架,RegretMinimizationFramework。遗憾最小化框架,尤其在高度不确定的环境中,它可以帮助决策者以一种系统化的方式减少未......
  • Text Mesh Pro图文混排如何对任何图片都能实现
    1)TextMeshPro图文混排如何对任何图片都能实现2)UnityiOS平台的小图占用特别大的内存3)只在编辑器内,纹理不开启Read&Write情况下,如何获取纹理所有颜色值4)准备在海外发行游戏,有哪些比较常用的身份认证类SDK这是第372篇UWA技术知识分享的推送,精选了UWA社区的热门话题,涵盖了UWA问答......
  • egret 无法登录发布
    在C:\ProgramFiles(x86)\Egret\EgretLauncher\resources\app\out\app\electron-browser 找到subpage.js文件将里面的代码按下图注释并修改  ......
  • egret promise
    在TypeScript中,Promise是用于处理异步操作的对象。它表示一个可能在未来某个时间点完成或失败的操作,并返回操作结果或错误。Promise可以有三种状态:pending(进行中):Promise的初始状态,表示操作正在进行中。fulfilled(已完成):表示操作成功完成。rejected(已拒绝):表示操作失败。......
  • Avalonia 实现聊天消息渲染、图文混排(支持Windows、Linux、信创国产OS)
      在实现即时通讯软件或聊天软件时,渲染文字表情、图文混排是一项非常繁琐的工作,再加上还要支持GIF动图、引用消息、撤回消息、名片等不同样式的消息渲染时,就更加麻烦了。    好在我们可以使用ESFramework提供的IChatRender组件,使用它我们就能轻松实现类似于微信......
  • word图文混排复制到KindEditor图片不显示
    ​ 在之前在工作中遇到在富文本编辑器中粘贴图片不能展示的问题,于是各种网上扒拉,终于找到解决方案,在这里感谢一下知乎中众大神以及TheViper。通过知乎提供的思路找到粘贴的原理,通过TheViper找到粘贴图片的方法。其原理为一下步骤:监听粘贴事件;【用于插入图片】获取光标位置;【......
  • Regret Minimization Experience Replay in Off-Policy Reinforcement Learning
    发表时间:2021(NeurIPS2021)文章要点:理论表明,更高的hindsightTDerror,更加onpolicy,以及更准的targetQvalue的样本应该有更高的采样权重(ThetheorysuggeststhatdatawithhigherhindsightTDerror,betteron-policinessandmoreaccuratetargetQvalueshouldbea......