当光标处在非普通文本模式时,为光标设置有显著特征的样式,帮助用户一眼区分接下来输入的文本样式

本贴最后更新于 588 天前,其中的信息可能已经物是人非

问题

在使用几乎所有的 富文本编辑器中,我都会遇到这样一个问题:当前光标处在加粗文本和普通文本之间,再输入新文字,新文字是加粗还是正常文字?

我不知道,反正用肉眼是判断不出来的,只有先输入一个字符看看是什么样式,如果样式不对,就退格,按下快捷键取消加粗。

如果常常需要分出一部分精力去推测当前光标处新文字的样式,对于写作时思维的连续性影响很大。

我相信这不是我一个人遇到过的的问题。

方案

给光标定义两种样式,当它处在正常文本时,是普通样式;当接下来要输入的时带特殊样式的文字,例如:

  • 加粗
  • 斜体
  • 链接标题
  • 行内代码
  • 高亮文本

就变下光标的样式,例如:

  • 变个显眼的颜色
  • 加上渐变色
  • 闪烁速度变快
  • 变粗
  • ……(如何设计更美观,需要探索)

这样就能以最简单有效的方式,表示接下来输入的是带有特殊样式的文字,用户的视线不用离开光标,就能得知接下来输入的文字是加粗、还是普通文本,不再会对光标的状态不清楚了。

示例,将输入光标改为醒目的红色:

image.png

1 操作
HaujetZhao 在 2021-10-22 16:48:07 更新了该帖

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • Achuan-2
    订阅者

    所见即所得没有不能区分的问题的,比如行内样式只要光标跳出了,再输入就是普通样式

    1 回复
  • HaujetZhao 14 评论
    支持者 订阅者 作者

    各个编辑器的处理不一样,比如,下面这个图,你能猜到接下来输入的文字是普通文字还是粗体吗:

    image.png

    它的周围都是普通文字,只是它是从一个加粗文本退格到了那里,还保持着加粗状态,再输入新文字,仍是加粗文字,仅凭肉眼看光标处,根本无法一下子分辨出它接下来要输出的文字是什么样式。

    城然,有其它方法去分辨,例如:

    • 去看工具栏
    • 输入一个字试试

    但不在光标处直接显示接下来输入的格式,而使用这些补丁式的方法,都是对思维连续性的打断,影响创作流。

    有个问题,如果光标颜色变来变去会不会反而影响了用户的写作思路呢?
    Vanessa
    @Vanessa 能够以最简洁的方式 搞清楚编辑器的状态,不用去揣摩编辑器的状态,是减轻了思考负担 。分出一部分心来去思考工具的状态、输入法的状态,相当的降低效率
    HaujetZhao
    @HaujetZhao 问题是按照现在的逻辑,也就是 @Achuan-2 所说的,跳出则为普通文本。用户习惯后跟本不用去考虑状态,反而会被颜色所吸引。
    Vanessa
    @Vanessa 用户生活中用的可不止思源一个编辑器,就算他能把每个光标编辑器的逻辑都记下来,也要分一部分心去判断。
    HaujetZhao
    @Vanessa 你们开发,最大的问题就是前置了一个立场:用户在生活中只使用思源笔记编辑器,用户对思源编辑器的习惯就是对所有编辑器的最高的习惯。
    HaujetZhao
    @HaujetZhao 我们参考了很多笔记软件的。目前的处理和 wolai,notion 基本一致。
    Vanessa
    @Vanessa 更多的人使用 Word 吧,光标逻辑是不是相反 你们网页端 Vditor,光标插到加粗和非加粗之间,这个边界地带,这是属于跳出了行内样式,还是没跳出?此时应当输入什么样式?
    HaujetZhao
    @Vanessa 现实就是,用户将光标插到加粗、普通文本中间时候,有两种倾向:补充加粗文字、补充普通文字。编辑器判断不了,只能默认一种行为。但各个软件的默认行为还不一致。你思源笔记是一个光标处理模式,word 又是一个模式。用户就要判断,我当前是在哪个编辑器,在这个编辑器中光标放到这里时输入的是加粗还是普通文本。人脑的缓冲本来就弱,加入这一揣摩过程,许多输入过程的思绪被严重打乱,尤其是当判断错误,需要退格,用快捷键调整格式,再次输入时候。
    HaujetZhao
    @HaujetZhao Vditor 具体要看编辑模式了,我电脑上没有 Word,稍后去老板电脑上学习一下 😊 其实还是习惯问题,用 word 的人可能不会是我们的用户 😄
    Vanessa
    @Vanessa 你看下链滴现在的所见即所得模式,插入后就是默认输入粗体。用 word 的人可能不用你们的笔记软件。但用你们笔记软件的每个人肯定生活中多多少少要用 word
    HaujetZhao
    @HaujetZhao 感觉 typora 的即使渲染模式使用标记符作为分割可以完美的解决这个问题
    Vanessa
    @Vanessa 但是光标会跳动位置,同时性能受限,跳动有延迟,文字越多,延迟越大,我把光标放链接后,要等他 1 秒完成光标跳动,再输入文字,很是头疼。这个帖子已经说了,变个光标颜色就能解决的事。Typora 的方案一比,反而显得复杂不好用了。
    HaujetZhao
    @HaujetZhao 我觉得应该再征求一下其他用户的意见,如果说已经习惯了的,再去变颜色就会分散注意力,还要去想这个颜色是什么意思。
    Vanessa
    @Vanessa 最通用的方案是一个设置项:光标普通状态的颜色、特殊状态的颜色。不喜欢变色的,就两个状态都调成一样的颜色,喜欢的,就调成两个喜爱的、个性的颜色
    HaujetZhao 1

推荐标签 标签

  • LeetCode

    LeetCode(力扣)是一个全球极客挚爱的高质量技术成长平台,想要学习和提升专业能力从这里开始,充足技术干货等你来啃,轻松拿下 Dream Offer!

    209 引用 • 72 回帖
  • Unity

    Unity 是由 Unity Technologies 开发的一个让开发者可以轻松创建诸如 2D、3D 多平台的综合型游戏开发工具,是一个全面整合的专业游戏引擎。

    22 引用 • 7 回帖 • 314 关注
  • SVN

    SVN 是 Subversion 的简称,是一个开放源代码的版本控制系统,相较于 RCS、CVS,它采用了分支管理系统,它的设计目标就是取代 CVS。

    29 引用 • 98 回帖 • 659 关注
  • 音乐

    你听到信仰的声音了么?

    58 引用 • 515 回帖
  • 心情

    心是产生任何想法的源泉,心本体会陷入到对自己本体不能理解的状态中,因为心能产生任何想法,不能分出对错,不能分出自己。

    59 引用 • 369 回帖
  • WebSocket

    WebSocket 是 HTML5 中定义的一种新协议,它实现了浏览器与服务器之间的全双工通信(full-duplex)。

    48 引用 • 206 回帖 • 469 关注
  • PWA

    PWA(Progressive Web App)是 Google 在 2015 年提出、2016 年 6 月开始推广的项目。它结合了一系列现代 Web 技术,在网页应用中实现和原生应用相近的用户体验。

    14 引用 • 69 回帖 • 75 关注
  • 新人

    让我们欢迎这对新人。哦,不好意思说错了,让我们欢迎这位新人!
    新手上路,请谨慎驾驶!

    50 引用 • 225 回帖
  • iOS

    iOS 是由苹果公司开发的移动操作系统,最早于 2007 年 1 月 9 日的 Macworld 大会上公布这个系统,最初是设计给 iPhone 使用的,后来陆续套用到 iPod touch、iPad 以及 Apple TV 等产品上。iOS 与苹果的 Mac OS X 操作系统一样,属于类 Unix 的商业操作系统。

    83 引用 • 129 回帖 • 2 关注
  • 负能量

    上帝为你关上了一扇门,然后就去睡觉了....努力不一定能成功,但不努力一定很轻松 (° ー °〃)

    84 引用 • 1161 回帖 • 486 关注
  • Shell

    Shell 脚本与 Windows/Dos 下的批处理相似,也就是用各类命令预先放入到一个文件中,方便一次性执行的一个程序文件,主要是方便管理员进行设置或者管理用的。但是它比 Windows 下的批处理更强大,比用其他编程程序编辑的程序效率更高,因为它使用了 Linux/Unix 下的命令。

    119 引用 • 73 回帖 • 110 关注
  • 资讯

    资讯是用户因为及时地获得它并利用它而能够在相对短的时间内给自己带来价值的信息,资讯有时效性和地域性。

    47 引用 • 83 回帖
  • 尊园地产

    昆明尊园房地产经纪有限公司,即:Kunming Zunyuan Property Agency Company Limited(简称“尊园地产”)于 2007 年 6 月开始筹备,2007 年 8 月 18 日正式成立,注册资本 200 万元,公司性质为股份经纪有限公司,主营业务为:代租、代售、代办产权过户、办理银行按揭、担保、抵押、评估等。

    1 引用 • 22 回帖 • 582 关注
  • Tomcat

    Tomcat 最早是由 Sun Microsystems 开发的一个 Servlet 容器,在 1999 年被捐献给 ASF(Apache Software Foundation),隶属于 Jakarta 项目,现在已经独立为一个顶级项目。Tomcat 主要实现了 JavaEE 中的 Servlet、JSP 规范,同时也提供 HTTP 服务,是市场上非常流行的 Java Web 容器。

    155 引用 • 529 回帖 • 1 关注
  • 脑图

    脑图又叫思维导图,是表达发散性思维的有效图形思维工具 ,它简单却又很有效,是一种实用性的思维工具。

    20 引用 • 57 回帖 • 1 关注
  • 微信

    腾讯公司 2011 年 1 月 21 日推出的一款手机通讯软件。用户可以通过摇一摇、搜索号码、扫描二维码等添加好友和关注公众平台,同时可以将自己看到的精彩内容分享到微信朋友圈。

    127 引用 • 779 回帖 • 1 关注
  • PWL

    组织简介

    用爱发电 (Programming With Love) 是一个以开源精神为核心的民间开源爱好者技术组织,“用爱发电”象征开源与贡献精神,加入组织,代表你将遵守组织的“个人开源爱好者”的各项条款。申请加入:用爱发电组织邀请帖
    用爱发电组织官网:https://programmingwithlove.stackoverflow.wiki/

    用爱发电组织的核心驱动力:

    • 遵守开源守则,体现开源&贡献精神:以分享为目的,拒绝非法牟利。
    • 自我保护:使用适当的 License 保护自己的原创作品。
    • 尊重他人:不以各种理由、各种漏洞进行未经允许的抄袭、散播、洩露;以礼相待,尊重所有对社区做出贡献的开发者;通过他人的分享习得知识,要留下足迹,表示感谢。
    • 热爱编程、热爱学习:加入组织,热爱编程是首当其要的。我们欢迎热爱讨论、分享、提问的朋友,也同样欢迎默默成就的朋友。
    • 倾听:正确并恳切对待、处理问题与建议,及时修复开源项目的 Bug ,及时与反馈者沟通。不抬杠、不无视、不辱骂。
    • 平视:不诋毁、轻视、嘲讽其他开发者,主动提出建议、施以帮助,以和谐为本。只要他人肯努力,你也可能会被昔日小看的人所超越,所以请保持谦虚。
    • 乐观且活跃:你的努力决定了你的高度。不要放弃,多年后回头俯瞰,才会发现自己已经成就往日所仰望的水平。积极地将项目开源,帮助他人学习、改进,自己也会获得相应的提升、成就与成就感。
    1 引用 • 487 回帖 • 1 关注
  • 生活

    生活是指人类生存过程中的各项活动的总和,范畴较广,一般指为幸福的意义而存在。生活实际上是对人生的一种诠释。生活包括人类在社会中与自己息息相关的日常活动和心理影射。

    225 引用 • 1443 回帖
  • Windows

    Microsoft Windows 是美国微软公司研发的一套操作系统,它问世于 1985 年,起初仅仅是 Microsoft-DOS 模拟环境,后续的系统版本由于微软不断的更新升级,不但易用,也慢慢的成为家家户户人们最喜爱的操作系统。

    203 引用 • 459 回帖
  • gRpc
    10 引用 • 8 回帖 • 14 关注
  • MongoDB

    MongoDB(来自于英文单词“Humongous”,中文含义为“庞大”)是一个基于分布式文件存储的数据库,由 C++ 语言编写。旨在为应用提供可扩展的高性能数据存储解决方案。MongoDB 是一个介于关系数据库和非关系数据库之间的产品,是非关系数据库当中功能最丰富,最像关系数据库的。它支持的数据结构非常松散,是类似 JSON 的 BSON 格式,因此可以存储比较复杂的数据类型。

    88 引用 • 59 回帖 • 2 关注
  • Ubuntu

    Ubuntu(友帮拓、优般图、乌班图)是一个以桌面应用为主的 Linux 操作系统,其名称来自非洲南部祖鲁语或豪萨语的“ubuntu”一词,意思是“人性”、“我的存在是因为大家的存在”,是非洲传统的一种价值观,类似华人社会的“仁爱”思想。Ubuntu 的目标在于为一般用户提供一个最新的、同时又相当稳定的主要由自由软件构建而成的操作系统。

    120 引用 • 168 回帖 • 197 关注
  • Sphinx

    Sphinx 是一个基于 SQL 的全文检索引擎,可以结合 MySQL、PostgreSQL 做全文搜索,它可以提供比数据库本身更专业的搜索功能,使得应用程序更容易实现专业化的全文检索。

    1 引用 • 158 关注
  • Facebook

    Facebook 是一个联系朋友的社交工具。大家可以通过它和朋友、同事、同学以及周围的人保持互动交流,分享无限上传的图片,发布链接和视频,更可以增进对朋友的了解。

    4 引用 • 15 回帖 • 476 关注
  • WordPress

    WordPress 是一个使用 PHP 语言开发的博客平台,用户可以在支持 PHP 和 MySQL 数据库的服务器上架设自己的博客。也可以把 WordPress 当作一个内容管理系统(CMS)来使用。WordPress 是一个免费的开源项目,在 GNU 通用公共许可证(GPLv2)下授权发布。

    45 引用 • 113 回帖 • 366 关注
  • React

    React 是 Facebook 开源的一个用于构建 UI 的 JavaScript 库。

    192 引用 • 291 回帖 • 481 关注
  • 开源中国

    开源中国是目前中国最大的开源技术社区。传播开源的理念,推广开源项目,为 IT 开发者提供了一个发现、使用、并交流开源技术的平台。目前开源中国社区已收录超过两万款开源软件。

    7 引用 • 86 回帖 • 2 关注