登录 注册

1.8.7 折叠小三角的位置问题

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

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

image.png

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

image.png

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

image.png

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

  • 思源笔记

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

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

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

相关帖子

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

欢迎来到这里！

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

注册 关于
请输入回帖内容 ...
  • fangly • • 2 赞同
    订阅者 先知

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

    temp128.gif

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

    temp129.gif

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

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

    1 回复
    1 操作
    fangly 在 2022-03-06 00:05:43 更新了该回帖
  • 其他回帖
  • mozhu • • 1 评论
    订阅者 付费者 支持者 捐赠者

    有了小三角很不错，希望再优化一下。

    比如标题的折叠，折叠后只是标题大小进行了缩放，希望能参考其他程序，折叠状态下默认显示小三角。

    对于列表项的，可以通过圆点状态这个问题不大。

    为了保持一致，标题也是从外观上来进行区别
    Vanessa •
  • mozhu • • 1 评论
    订阅者 付费者 支持者 捐赠者

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

    image.png

    换成默认主题也是这样，因为我同时开启了左右侧栏，中间编辑器区域一窄块标和小三角就会变成竖排了
    deerain •
  • fangly • • 5 评论
    订阅者 先知

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

    image.png

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

    image.png

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

近期热议

推荐标签 标签

  • gRpc
    10 引用 • 8 回帖 • 55 关注
  • 大数据

    大数据（big data）是指无法在一定时间范围内用常规软件工具进行捕捉、管理和处理的数据集合，是需要新处理模式才能具有更强的决策力、洞察发现力和流程优化能力的海量、高增长率和多样化的信息资产。

    89 引用 • 113 回帖
  • RabbitMQ

    RabbitMQ 是一个开源的 AMQP 实现，服务器端用 Erlang 语言编写，支持多种语言客户端，如：Python、Ruby、.NET、Java、C、PHP、ActionScript 等。用于在分布式系统中存储转发消息，在易用性、扩展性、高可用性等方面表现不俗。

    49 引用 • 60 回帖 • 399 关注
  • 爬虫

    网络爬虫（Spider、Crawler），是一种按照一定的规则，自动地抓取万维网信息的程序。

    106 引用 • 275 回帖 • 2 关注
  • 坑

    一些有用的避坑指南。

    69 引用 • 93 回帖 • 2 关注
  • OnlyOffice
    4 引用 • 23 关注
  • V2EX

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

    17 引用 • 236 回帖 • 418 关注
  • Google

    Google（Google Inc.，NASDAQ：GOOG）是一家美国上市公司（公有股份公司），于 1998 年 9 月 7 日以私有股份公司的形式创立，设计并管理一个互联网搜索引擎。Google 公司的总部称作“Googleplex”，它位于加利福尼亚山景城。Google 目前被公认为是全球规模最大的搜索引擎，它提供了简单易用的免费服务。不作恶（Don't be evil）是谷歌公司的一项非正式的公司口号。

    49 引用 • 192 回帖
  • ngrok

    ngrok 是一个反向代理，通过在公共的端点和本地运行的 Web 服务器之间建立一个安全的通道。

    7 引用 • 63 回帖 • 598 关注
  • Maven

    Maven 是基于项目对象模型（POM）、通过一小段描述信息来管理项目的构建、报告和文档的软件项目管理工具。

    185 引用 • 318 回帖 • 344 关注
  • Node.js

    Node.js 是一个基于 Chrome JavaScript 运行时建立的平台， 用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动， 非阻塞 I/O 模型而得以轻量和高效。

    138 引用 • 268 回帖 • 194 关注
  • BAE

    百度应用引擎（Baidu App Engine）提供了 PHP、Java、Python 的执行环境，以及云存储、消息服务、云数据库等全面的云服务。它可以让开发者实现自动地部署和管理应用，并且提供动态扩容和负载均衡的运行环境，让开发者不用考虑高成本的运维工作，只需专注于业务逻辑，大大降低了开发者学习和迁移的成本。

    19 引用 • 75 回帖 • 618 关注
  • uTools

    uTools 是一个极简、插件化、跨平台的现代桌面软件。通过自由选配丰富的插件，打造你得心应手的工具集合。

    5 引用 • 13 回帖
  • 996

    “工作 996， 生病 ICU”

    13 引用 • 200 回帖
  • 尊园地产

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

    1 引用 • 22 回帖 • 684 关注
  • Mac

    Mac 是苹果公司自 1984 年起以“Macintosh”开始开发的个人消费型计算机，如：iMac、Mac mini、Macbook Air、Macbook Pro、Macbook、Mac Pro 等计算机。

    164 引用 • 594 回帖 • 1 关注
  • FFmpeg

    FFmpeg 是一套可以用来记录、转换数字音频、视频，并能将其转化为流的开源计算机程序。

    22 引用 • 31 回帖 • 3 关注
  • 设计模式

    设计模式（Design pattern）代表了最佳的实践，通常被有经验的面向对象的软件开发人员所采用。设计模式是软件开发人员在软件开发过程中面临的一般问题的解决方案。这些解决方案是众多软件开发人员经过相当长的一段时间的试验和错误总结出来的。

    198 引用 • 120 回帖
  • 微信

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

    129 引用 • 793 回帖
  • 国际化

    i18n（其来源是英文单词 internationalization 的首末字符 i 和 n，18 为中间的字符数）是“国际化”的简称。对程序来说，国际化是指在不修改代码的情况下，能根据不同语言及地区显示相应的界面。

    7 引用 • 26 回帖 • 3 关注
  • PHP

    PHP（Hypertext Preprocessor）是一种开源脚本语言。语法吸收了 C 语言、 Java 和 Perl 的特点，主要适用于 Web 开发领域，据说是世界上最好的编程语言。

    164 引用 • 407 回帖 • 528 关注
  • Docker

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

    476 引用 • 899 回帖
  • Vditor

    Vditor 是一款浏览器端的 Markdown 编辑器，支持所见即所得、即时渲染（类似 Typora）和分屏预览模式。它使用 TypeScript 实现，支持原生 JavaScript、Vue、React 和 Angular。

    313 引用 • 1667 回帖 • 1 关注
  • RESTful

    一种软件架构设计风格而不是标准，提供了一组设计原则和约束条件，主要用于客户端和服务器交互类的软件。基于这个风格设计的软件可以更简洁，更有层次，更易于实现缓存等机制。

    30 引用 • 114 回帖 • 1 关注
  • React

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

    192 引用 • 291 回帖 • 443 关注
  • 自由行
    • 1 关注
  • SOHO

    为成为自由职业者在家办公而努力吧！

    7 引用 • 55 回帖 • 92 关注

最新标签