登录 注册

1.8.7 折叠小三角的位置问题

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

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

image.png

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

image.png

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

image.png

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

  • 思源笔记

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

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

    25293 引用 • 104400 回帖
1 引用
1， 小三角在列表前面时不显示，仅接触列表时才显示 2. 折叠标题内容时有点迟钝，没列表折叠快，慢很多 • 88250
1 操作
deerain 在 2022-03-05 23:46:06 更新了该帖
3 感谢
1 关注
1 收藏
6 赞同
1 引用
1 操作
14 回帖
3
1.8k 279 251 647 37 27 532

相关帖子

14 回帖
1.8.7 折叠小三角的位置问题

欢迎来到这里！

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

注册 关于
请输入回帖内容 ...
  • mozhu • • 1 评论
    订阅者 付费者 支持者 捐赠者

    第一个问题，可能是主题宽度问题

    image.png

    换成默认主题也是这样，因为我同时开启了左右侧栏，中间编辑器区域一窄块标和小三角就会变成竖排了
    deerain •
  • 其他回帖
  • Belf •
    付费者

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

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

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

    image.png

  • fangly • • 5 评论
    订阅者 先知

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

    image.png

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

    image.png

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

    感觉被折叠的内容一直显示三角形好一点，可以直观的看出哪些内容是折叠状态的。视觉上可以做些适当弱化，应该也不太影响美观。

    折叠状态可以通过前面的圆点样式来区别
    Vanessa •
  • 查看全部回帖
deerain
还好我技压全场
回帖
251
 帖子
57
 积分
9965

近期热议

推荐标签 标签

  • TextBundle

    TextBundle 文件格式旨在应用程序之间交换 Markdown 或 Fountain 之类的纯文本文件时，提供更无缝的用户体验。

    1 引用 • 2 回帖 • 81 关注
  • WebComponents

    Web Components 是 W3C 定义的标准，它给了前端开发者扩展浏览器标签的能力，可以方便地定制可复用组件，更好的进行模块化开发，解放了前端开发者的生产力。

    1 引用 • 8 关注
  • Ant-Design

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

    17 引用 • 23 回帖 • 1 关注
  • Hexo

    Hexo 是一款快速、简洁且高效的博客框架，使用 Node.js 编写。

    22 引用 • 148 回帖 • 16 关注
  • Openfire

    Openfire 是开源的、基于可拓展通讯和表示协议 (XMPP)、采用 Java 编程语言开发的实时协作服务器。Openfire 的效率很高，单台服务器可支持上万并发用户。

    6 引用 • 7 回帖 • 103 关注
  • 微软

    微软是一家美国跨国科技公司，也是世界 PC 软件开发的先导，由比尔·盖茨与保罗·艾伦创办于 1975 年，公司总部设立在华盛顿州的雷德蒙德（Redmond，邻近西雅图）。以研发、制造、授权和提供广泛的电脑软件服务业务为主。

    8 引用 • 44 回帖 • 2 关注
  • 又拍云

    又拍云是国内领先的 CDN 服务提供商,国家工信部认证通过的“可信云”，乌云众测平台认证的“安全云”，为移动时代的创业者提供新一代的 CDN 加速服务。

    20 引用 • 37 回帖 • 573 关注
  • 叶归
    6 引用 • 17 回帖 • 12 关注
  • DNSPod

    DNSPod 建立于 2006 年 3 月份，是一款免费智能 DNS 产品。 DNSPod 可以为同时有电信、网通、教育网服务器的网站提供智能的解析，让电信用户访问电信的服务器，网通的用户访问网通的服务器，教育网的用户访问教育网的服务器，达到互联互通的效果。

    6 引用 • 26 回帖 • 527 关注
  • jsoup

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

    6 引用 • 1 回帖 • 487 关注
  • Log4j

    Log4j 是 Apache 开源的一款使用广泛的 Java 日志组件。

    20 引用 • 18 回帖 • 29 关注
  • LeetCode

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

    209 引用 • 72 回帖 • 3 关注
  • CodeMirror
    2 引用 • 17 回帖 • 161 关注
  • Mobi.css

    Mobi.css is a lightweight, flexible CSS framework that focus on mobile.

    1 引用 • 6 回帖 • 757 关注
  • JetBrains

    JetBrains 是一家捷克的软件开发公司，该公司位于捷克的布拉格，并在俄国的圣彼得堡及美国麻州波士顿都设有办公室，该公司最为人所熟知的产品是 Java 编程语言开发撰写时所用的集成开发环境：IntelliJ IDEA。

    18 引用 • 54 回帖 • 1 关注
  • 学习

    “梦想从学习开始，事业从实践起步” —— 习近平

    173 引用 • 518 回帖
  • Electron

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

    15 引用 • 136 回帖 • 2 关注
  • SendCloud

    SendCloud 由搜狐武汉研发中心孵化的项目，是致力于为开发者提供高质量的触发邮件服务的云端邮件发送平台，为开发者提供便利的 API 接口来调用服务，让邮件准确迅速到达用户收件箱并获得强大的追踪数据。

    2 引用 • 8 回帖 • 495 关注
  • Spark

    Spark 是 UC Berkeley AMP lab 所开源的类 Hadoop MapReduce 的通用并行框架。Spark 拥有 Hadoop MapReduce 所具有的优点；但不同于 MapReduce 的是 Job 中间输出结果可以保存在内存中，从而不再需要读写 HDFS，因此 Spark 能更好地适用于数据挖掘与机器学习等需要迭代的 MapReduce 的算法。

    74 引用 • 46 回帖 • 564 关注
  • Outlook
    1 引用 • 5 回帖
  • 快应用

    快应用 是基于手机硬件平台的新型应用形态；标准是由主流手机厂商组成的快应用联盟联合制定；快应用标准的诞生将在研发接口、能力接入、开发者服务等层面建设标准平台；以平台化的生态模式对个人开发者和企业开发者全品类开放。

    15 引用 • 127 回帖 • 1 关注
  • 七牛云

    七牛云是国内领先的企业级公有云服务商，致力于打造以数据为核心的场景化 PaaS 服务。围绕富媒体场景，七牛先后推出了对象存储，融合 CDN 加速，数据通用处理，内容反垃圾服务，以及直播云服务等。

    28 引用 • 226 回帖 • 131 关注
  • 运维

    互联网运维工作，以服务为中心，以稳定、安全、高效为三个基本点，确保公司的互联网业务能够 7×24 小时为用户提供高质量的服务。

    150 引用 • 257 回帖
  • Sublime

    Sublime Text 是一款可以用来写代码、写文章的文本编辑器。支持代码高亮、自动完成，还支持通过插件进行扩展。

    10 引用 • 5 回帖 • 2 关注
  • Gitea

    Gitea 是一个开源社区驱动的轻量级代码托管解决方案，后端采用 Go 编写，采用 MIT 许可证。

    5 引用 • 16 回帖 • 2 关注
  • 外包

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

    26 引用 • 233 回帖 • 4 关注
  • Hadoop

    Hadoop 是由 Apache 基金会所开发的一个分布式系统基础架构。用户可以在不了解分布式底层细节的情况下，开发分布式程序。充分利用集群的威力进行高速运算和存储。

    89 引用 • 122 回帖 • 616 关注

最新标签