1.8.7 折叠小三角的位置问题

本贴最后更新于 754 天前,其中的信息可能已经天翻地覆

下图中,箭头标出的小三角其实是属于第一个列表项,但是它所在的位置却很难直观感受出这一点:

image.png

另外,块标和小三角都需要鼠标悬浮到内容块上才显示,假设鼠标本来在下图中的 A 位置,经过箭头标出的路径移到 B 位置,块标和小三角都不会显示,而这本来是最符合直觉的鼠标移动路径:

image.png

这样一来,为了点击到小三角,鼠标移动时就不得不走以下两种曲折路径:

image.png

总之感觉这个小三角的交互还有很大优化空间

  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    18150 引用 • 66977 回帖 • 1 关注
1 操作
deerain 在 2022-03-05 23:46:06 更新了该帖

相关帖子

欢迎来到这里!

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

注册 关于
请输入回帖内容 ...
  • Belf

    关于这个内容我也提一个建议。

    假如我的列表项里嵌套了一个任务项,那这个块的块标会特别多(如下),小三角的位置很气管,也不好操作。都很容易就点错了。

    我一直觉得列表项块和列表块的区分,导致一个块有好几种块类型的情况不是很合理。也就是 D 大以前说的一炮三响的问题,这个我还是觉得需要再考虑,只是我也提不出啥建设性的意见,也是不好意思。

    image.png

  • 其他回帖
  • 第一个问题,可能是主题宽度问题

    image.png

    换成默认主题也是这样,因为我同时开启了左右侧栏,中间编辑器区域一窄块标和小三角就会变成竖排了
    deerain
  • fangly 2 赞同

    像在 workflowy 里面,鼠标放在圆点左边就会显示标志:

    temp128.gif

    而在思源中,鼠标放在圆点左边不会触发任何东西:

    temp129.gif

    这个问题我很早就想提了,但当时我还能凑合用,因为对我来说,面向块标的最高频操作是复制列表项的块引用,而列表项的块标和圆点等价,因此我点击圆点就好,不用绕一圈来显示块标

    现在有了小三角后,和其他软件一对比,交互的别扭就体现得格外明显

    1 回复
    1 操作
    fangly 在 2022-03-06 00:05:43 更新了该回帖
  • fangly 5 评论

    @Vanessa 帖子中的另一个问题,就是在窄窗口情况下,块标的排列顺序是不是需要修改一下,就是下面这个图中,三个块标的顺序应该颠倒一下更符合逻辑

    image.png

    离圆点最近的应该是小三角,然后是列表项块,最后是列表块,像正常情况下的逻辑就是这样的:

    image.png

    这个整体上移也会有点奇怪,最上面的图标就会和其他块对齐了,这个还要再想想怎么弄。
    Vanessa
    @Vanessa 我的意思不是说整体上移,是说三个块标位置颠倒,小三角和列表块图标交换位置。这样设计的话,想要折叠展开,只需要把鼠标放在圆点旁边就能触发小三角;想要点击或拖动列表项块标,直接点击或拖动圆点是等价的,也很方便;而列表块块标用的次数相比前两者用的次数会少很多,这样设计的话基本就能满足大部分场景了。
    fangly
    @fangly 图标是从上到下,从左到右,如果竖排倒序的话会不会有点奇怪,要不再想想?
    Vanessa
    @Vanessa 按我的想法从下到上的话,相当于把横排的布局逆时针旋转 90 度就是竖排的布局(如果是整体上移就相当于顺时针旋转 90 度);另一种角度看,小三角在横排时是最靠近圆点的,竖排时也最靠近圆点,列表块横排时最远离圆点,竖排时也最远离圆点。我觉得这种是比较符合直观逻辑的,而且用起来更加方便,鼠标放在圆点左边就可以马上折叠展开了。
    fangly
    @fangly 好像很有道理,看看还有没有人有类似的需求 Issue #4374 · siyuan-note/siyuan
    Vanessa
  • 查看全部回帖

推荐标签 标签

  • 域名

    域名(Domain Name),简称域名、网域,是由一串用点分隔的名字组成的 Internet 上某一台计算机或计算机组的名称,用于在数据传输时标识计算机的电子方位(有时也指地理位置)。

    43 引用 • 208 回帖 • 1 关注
  • jsoup

    jsoup 是一款 Java 的 HTML 解析器,可直接解析某个 URL 地址、HTML 文本内容。它提供了一套非常省力的 API,可通过 DOM,CSS 以及类似于 jQuery 的操作方法来取出和操作数据。

    6 引用 • 1 回帖 • 457 关注
  • V2EX

    V2EX 是创意工作者们的社区。这里目前汇聚了超过 400,000 名主要来自互联网行业、游戏行业和媒体行业的创意工作者。V2EX 希望能够成为创意工作者们的生活和事业的一部分。

    17 引用 • 236 回帖 • 434 关注
  • MySQL

    MySQL 是一个关系型数据库管理系统,由瑞典 MySQL AB 公司开发,目前属于 Oracle 公司。MySQL 是最流行的关系型数据库管理系统之一。

    673 引用 • 535 回帖
  • 反馈

    Communication channel for makers and users.

    123 引用 • 906 回帖 • 177 关注
  • WordPress

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

    45 引用 • 113 回帖 • 321 关注
  • Love2D

    Love2D 是一个开源的, 跨平台的 2D 游戏引擎。使用纯 Lua 脚本来进行游戏开发。目前支持的平台有 Windows, Mac OS X, Linux, Android 和 iOS。

    14 引用 • 53 回帖 • 506 关注
  • SQLite

    SQLite 是一个进程内的库,实现了自给自足的、无服务器的、零配置的、事务性的 SQL 数据库引擎。SQLite 是全世界使用最为广泛的数据库引擎。

    4 引用 • 7 回帖 • 1 关注
  • Sym

    Sym 是一款用 Java 实现的现代化社区(论坛/BBS/社交网络/博客)系统平台。

    下一代的社区系统,为未来而构建

    522 引用 • 4581 回帖 • 687 关注
  • WebClipper

    Web Clipper 是一款浏览器剪藏扩展,它可以帮助你把网页内容剪藏到本地。

    3 引用 • 9 回帖 • 4 关注
  • 分享

    有什么新发现就分享给大家吧!

    240 引用 • 1729 回帖 • 1 关注
  • Eclipse

    Eclipse 是一个开放源代码的、基于 Java 的可扩展开发平台。就其本身而言,它只是一个框架和一组服务,用于通过插件组件构建开发环境。

    75 引用 • 258 回帖 • 625 关注
  • Firefox

    Mozilla Firefox 中文俗称“火狐”(正式缩写为 Fx 或 fx,非正式缩写为 FF),是一个开源的网页浏览器,使用 Gecko 排版引擎,支持多种操作系统,如 Windows、OSX 及 Linux 等。

    7 引用 • 30 回帖 • 458 关注
  • Electron

    Electron 基于 Chromium 和 Node.js,让你可以使用 HTML、CSS 和 JavaScript 构建应用。它是一个由 GitHub 及众多贡献者组成的活跃社区共同维护的开源项目,兼容 Mac、Windows 和 Linux,它构建的应用可在这三个操作系统上面运行。

    15 引用 • 136 回帖
  • Docker

    Docker 是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的容器中,然后发布到任何流行的操作系统上。容器完全使用沙箱机制,几乎没有性能开销,可以很容易地在机器和数据中心中运行。

    475 引用 • 899 回帖
  • DevOps

    DevOps(Development 和 Operations 的组合词)是一组过程、方法与系统的统称,用于促进开发(应用程序/软件工程)、技术运营和质量保障(QA)部门之间的沟通、协作与整合。

    37 引用 • 24 回帖 • 1 关注
  • OkHttp

    OkHttp 是一款 HTTP & HTTP/2 客户端库,专为 Android 和 Java 应用打造。

    16 引用 • 6 回帖 • 56 关注
  • 前端

    前端技术一般分为前端设计和前端开发,前端设计可以理解为网站的视觉设计,前端开发则是网站的前台代码实现,包括 HTML、CSS 以及 JavaScript 等。

    247 引用 • 1347 回帖
  • Kafka

    Kafka 是一种高吞吐量的分布式发布订阅消息系统,它可以处理消费者规模的网站中的所有动作流数据。 这种动作(网页浏览,搜索和其他用户的行动)是现代系统中许多功能的基础。 这些数据通常是由于吞吐量的要求而通过处理日志和日志聚合来解决。

    35 引用 • 35 回帖
  • 外包

    有空闲时间是接外包好呢还是学习好呢?

    26 引用 • 232 回帖 • 18 关注
  • CAP

    CAP 指的是在一个分布式系统中, Consistency(一致性)、 Availability(可用性)、Partition tolerance(分区容错性),三者不可兼得。

    11 引用 • 5 回帖 • 552 关注
  • Ant-Design

    Ant Design 是服务于企业级产品的设计体系,基于确定和自然的设计价值观上的模块化解决方案,让设计者和开发者专注于更好的用户体验。

    17 引用 • 23 回帖
  • 黑曜石

    黑曜石是一款强大的知识库工具,支持本地 Markdown 文件编辑,支持双向链接和关系图。

    A second brain, for you, forever.

    9 引用 • 83 回帖
  • LaTeX

    LaTeX(音译“拉泰赫”)是一种基于 ΤΕΧ 的排版系统,由美国计算机学家莱斯利·兰伯特(Leslie Lamport)在 20 世纪 80 年代初期开发,利用这种格式,即使使用者没有排版和程序设计的知识也可以充分发挥由 TeX 所提供的强大功能,能在几天,甚至几小时内生成很多具有书籍质量的印刷品。对于生成复杂表格和数学公式,这一点表现得尤为突出。因此它非常适用于生成高印刷质量的科技和数学类文档。

    9 引用 • 32 回帖 • 178 关注
  • 知乎

    知乎是网络问答社区,连接各行各业的用户。用户分享着彼此的知识、经验和见解,为中文互联网源源不断地提供多种多样的信息。

    10 引用 • 66 回帖
  • 微服务

    微服务架构是一种架构模式,它提倡将单一应用划分成一组小的服务。服务之间互相协调,互相配合,为用户提供最终价值。每个服务运行在独立的进程中。服务于服务之间才用轻量级的通信机制互相沟通。每个服务都围绕着具体业务构建,能够被独立的部署。

    96 引用 • 155 回帖 • 1 关注
  • Wide

    Wide 是一款基于 Web 的 Go 语言 IDE。通过浏览器就可以进行 Go 开发,并有代码自动完成、查看表达式、编译反馈、Lint、实时结果输出等功能。

    欢迎访问我们运维的实例: https://wide.b3log.org

    30 引用 • 218 回帖 • 594 关注