Code Monkey home page Code Monkey logo

Comments (7)

xfgryujk avatar xfgryujk commented on August 23, 2024

表情太大有点喧宾夺主,参考国外的平台表情都是比文字稍大一点,现在的大小是合理的

from blivechat.

merlin-kitsune avatar merlin-kitsune commented on August 23, 2024

你没明白我的意思。官方表情是长条的,且为文字大小做了适配不会因为和字差不多大缺少细节。而UP主大表情是主播自行找人约稿上传的,绝大多数没有根据文字大小做适配,所以在实际使用时候,需要增加大小来确保显示细节。主播的UP主大表情在后台上传的版本是162x162大小的。
在css层面,官方的表情和UP主大表情共用同一个id,导致我需要增加UP主大表情大小的时候,会连带将官方表情一并变大,导致观众发官方表情的时候占了过大面积。虽然可以指定height为想要的大小,把width设置为auto来缓解,但是仍然没法根本解决问题。内置的样式编辑器控制大小也是width而不是height。
所以我需要在css层面能区分官方表情和UP主大表情,避免因为调整UP主大表情到合适大小的时候导致官方表情显示过大。当然最好还是能禁用官方表情功能,直接输出文本,这样可以通过关键词来设置替换表情

from blivechat.

merlin-kitsune avatar merlin-kitsune commented on August 23, 2024

另外还有几个CSS问题:

  1. 如果最后一条弹幕是表情,会导致顶部的内容提前溢出,补发一条文字弹幕后又会显示正常。
  2. 如果弹幕内容未设置为换行,且浏览器源宽度不足的情况下,发送表情弹幕会导致显示呈阶梯状错位。

我没有图床,github的issue也没办法上传图片,如果可能最好给一下其他联系方式谢谢

from blivechat.

swzsweet avatar swzsweet commented on August 23, 2024

另外还有几个CSS问题:

  1. 如果最后一条弹幕是表情,会导致顶部的内容提前溢出,补发一条文字弹幕后又会显示正常。
  2. 如果弹幕内容未设置为换行,且浏览器源宽度不足的情况下,发送表情弹幕会导致显示呈阶梯状错位。

我没有图床,github的issue也没办法上传图片,如果可能最好给一下其他联系方式谢谢
github的issue可以直接粘贴图片的

from blivechat.

xfgryujk avatar xfgryujk commented on August 23, 2024

另外还有几个CSS问题:

  1. 如果最后一条弹幕是表情,会导致顶部的内容提前溢出,补发一条文字弹幕后又会显示正常。
  2. 如果弹幕内容未设置为换行,且浏览器源宽度不足的情况下,发送表情弹幕会导致显示呈阶梯状错位。

我没有图床,github的issue也没办法上传图片,如果可能最好给一下其他联系方式谢谢

你还是传截图吧
QQ截图20220309184135

from blivechat.

gin3715 avatar gin3715 commented on August 23, 2024

B站网页直播间的侧栏,通用表情的css class是danmaku-content v-middle ts-dot-2 pointer emoticon
而UP主自定义表情则是danmaku-content v-middle ts-dot-2 pointer emoticon bulge,多了一个bulge
自带的通用表情一般是2:1左右的aspect ratio,而UP主自定义表情则统一为1:1,为UP主表情额外添加一个css class(如bulge)可以方便更好地制定样式。
QQ截图20220419124904
QQ截图20220419124919
上面截图中的两个表情的DanmakuMessage.emoticon_options如下:
{"bulge_display": 1, "emoticon_unique": "room_21685677_1200", "height": 162, "in_player_area": 1, "is_dynamic": 1, "url": "http://i0.hdslb.com/bfs/garb/ba52054f74fcd0b44a70f2098fcda055431a2fbf.png", "width": 162}
{"bulge_display": 0, "emoticon_unique": "official_107", "height": 60, "in_player_area": 1, "is_dynamic": 1, "url": "http://i0.hdslb.com/bfs/live/4cf43ac5259589e9239c4e908c8149d5952fcc32.png", "width": 144}

from blivechat.

gin3715 avatar gin3715 commented on August 23, 2024

@xfgryujk
DanmakuMessage.emoticon_options["bulge_display"]的值0对应通用表情(无 bulge class),值1对应UP主自定义表情(有 bulge class)。可以根据该值决定是否给表情添加额外的 bulge class。

from blivechat.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.