<table><tr><td style="">broulik added a comment.
</td><a style="text-decoration: none; padding: 4px 8px; margin: 0 8px 8px; float: right; color: #464C5C; font-weight: bold; border-radius: 3px; background-color: #F7F7F9; background-image: linear-gradient(to bottom,#fff,#f1f0f1); display: inline-block; border: 1px solid rgba(71,87,120,.2);" href="https://phabricator.kde.org/D6392" rel="noreferrer">View Revision</a></tr></table><br /><div><div><p>I like the idea of showing the thickness in the button. My suggestion would be add a <tt style="background: #ebebeb; font-size: 13px;">Timer</tt> which you <tt style="background: #ebebeb; font-size: 13px;">restart()</tt> when you change the panel thickness (you need to try whether in <tt style="background: #ebebeb; font-size: 13px;">onThicknessChanged</tt> is sufficient or doing that explicitly in <tt style="background: #ebebeb; font-size: 13px;">onWheelEvent</tt> and/or <tt style="background: #ebebeb; font-size: 13px;">onPositionChanged</tt> and then bind the text to whether it's running, this way you don't break any bindings but just have it work like magic ;) for example:</p>

<div class="remarkup-code-block" style="margin: 12px 0;" data-code-lang="text" data-sigil="remarkup-code-block"><pre class="remarkup-code" style="font: 11px/15px "Menlo", "Consolas", "Monaco", monospace; padding: 12px; margin: 0; background: rgba(71, 87, 120, 0.08);">Timer {
    id: panelResizeSizeHintTimer
    interval: 1000
}

...

Button {
    text: panelResizeHintTimer.running ? panel.thickness : i18n("Width") // don't forget "Height" for horizontal panels
    ...
    onWheel: {
        // wheel stuff here
        panelResizeHintTimer.restart()
    ...
}</pre></div>

<p>(QtQuick <tt style="background: #ebebeb; font-size: 13px;">Timer</tt> <tt style="background: #ebebeb; font-size: 13px;">restart</tt> will start it if not running and restart it if already running, it also runs only once by default which is what we want here)</p></div></div><br /><div><strong>INLINE COMMENTS</strong><div><div style="margin: 6px 0 12px 0;"><div style="border: 1px solid #C7CCD9; border-radius: 3px;"><div style="padding: 0; background: #F7F7F7; border-color: #e3e4e8; border-style: solid; border-width: 0 0 1px 0; margin: 0;"><div style="color: #74777d; background: #eff2f4; padding: 6px 8px; overflow: hidden;"><a style="float: right; text-decoration: none;" href="https://phabricator.kde.org/D6392#inline-26336" rel="noreferrer">View Inline</a><span style="color: #4b4d51; font-weight: bold;">SizeHandle.qml:123</span></div>
<div style="font: 11px/15px "Menlo", "Consolas", "Monaco", monospace; white-space: pre-wrap; clear: both; padding: 4px 0; margin: 0;"><div style="padding: 0 8px; margin: 0 4px; background: rgba(151, 234, 151, .6);">        <span style="color: #aa4000">onWheelMoved:</span> <span class="p">{</span>
</div><div style="padding: 0 8px; margin: 0 4px; background: rgba(151, 234, 151, .6);">            <span style="color: #aa4000">if</span> <span class="p">(</span><span style="color: #004012">wheel</span><span class="p">.</span><span style="color: #004012">delta</span> <span style="color: #aa2211">></span> <span style="color: #601200">0</span><span class="p">)</span> <span class="p">{</span>
</div></div></div>
<div style="margin: 8px 0; padding: 0 12px;"><p style="padding: 0; margin: 8px;">I don't know exactly how <tt style="background: #ebebeb; font-size: 13px;">MouseEventListener</tt> behaves but in <tt style="background: #ebebeb; font-size: 13px;">MouseArea</tt> you get a ton of <tt style="background: #ebebeb; font-size: 13px;">onWheel</tt> events for touchpads (which scroll pixel-precisely), potentially causing you to making your panel enormous accidentally</p></div></div><br /><div style="border: 1px solid #C7CCD9; border-radius: 3px;"><div style="padding: 0; background: #F7F7F7; border-color: #e3e4e8; border-style: solid; border-width: 0 0 1px 0; margin: 0;"><div style="color: #74777d; background: #eff2f4; padding: 6px 8px; overflow: hidden;"><a style="float: right; text-decoration: none;" href="https://phabricator.kde.org/D6392#inline-26337" rel="noreferrer">View Inline</a><span style="color: #4b4d51; font-weight: bold;">SizeHandle.qml:125</span></div>
<div style="font: 11px/15px "Menlo", "Consolas", "Monaco", monospace; white-space: pre-wrap; clear: both; padding: 4px 0; margin: 0;"><div style="padding: 0 8px; margin: 0 4px; background: rgba(151, 234, 151, .6);">            <span style="color: #aa4000">if</span> <span class="p">(</span><span style="color: #004012">wheel</span><span class="p">.</span><span style="color: #004012">delta</span> <span style="color: #aa2211">></span> <span style="color: #601200">0</span><span class="p">)</span> <span class="p">{</span>
</div><div style="padding: 0 8px; margin: 0 4px; background: rgba(151, 234, 151, .6);">                <span style="color: #004012">panel</span><span class="p">.</span><span style="color: #004012">thickness</span> <span style="color: #aa2211">=</span> <span style="color: #304a96">Math</span><span class="p">.</span><span style="color: #004012">max</span><span class="p">(</span><span style="color: #004012">units</span><span class="p">.</span><span style="color: #004012">gridUnit</span><span class="p">,</span> <span style="color: #004012">panel</span><span class="p">.</span><span style="color: #004012">thickness</span> <span style="color: #aa2211">+</span> <span style="color: #601200">1</span><span class="p">);</span>
</div><div style="padding: 0 8px; margin: 0 4px; background: rgba(151, 234, 151, .6);">            <span class="p">}</span> <span style="color: #aa4000">else</span> <span style="color: #aa4000">if</span> <span class="p">(</span><span style="color: #004012">wheel</span><span class="p">.</span><span style="color: #004012">delta</span> <span style="color: #aa2211"><</span> <span style="color: #601200">0</span><span class="p">)</span> <span class="p">{</span>
</div></div></div>
<div style="margin: 8px 0; padding: 0 12px;"><p style="padding: 0; margin: 8px;">I think there's also a maximum size enforced (half of <tt style="background: #ebebeb; font-size: 13px;">screenToFollow.geometry</tt>), it's somewhat hidden in the complex <tt style="background: #ebebeb; font-size: 13px;">onPositionChanged</tt> code</p></div></div><br /><div style="border: 1px solid #C7CCD9; border-radius: 3px;"><div style="padding: 0; background: #F7F7F7; border-color: #e3e4e8; border-style: solid; border-width: 0 0 1px 0; margin: 0;"><div style="color: #74777d; background: #eff2f4; padding: 6px 8px; overflow: hidden;"><a style="float: right; text-decoration: none;" href="https://phabricator.kde.org/D6392#inline-26338" rel="noreferrer">View Inline</a><span style="color: #4b4d51; font-weight: bold;">SizeHandle.qml:129</span></div>
<div style="font: 11px/15px "Menlo", "Consolas", "Monaco", monospace; white-space: pre-wrap; clear: both; padding: 4px 0; margin: 0;"><div style="padding: 0 8px; margin: 0 4px; background: rgba(151, 234, 151, .6);">            <span class="p">}</span> <span style="color: #aa4000">else</span> <span class="p">{</span>
</div><div style="padding: 0 8px; margin: 0 4px; background: rgba(151, 234, 151, .6);">                <span style="color: #aa4000">return</span>
</div><div style="padding: 0 8px; margin: 0 4px; background: rgba(151, 234, 151, .6);">            <span class="p">}</span>
</div></div></div>
<div style="margin: 8px 0; padding: 0 12px;"><p style="padding: 0; margin: 8px;">Missing semicolon here and below, also can it ever get 0 anyway?</p></div></div></div></div></div><br /><div><strong>REPOSITORY</strong><div><div>R119 Plasma Desktop</div></div></div><br /><div><strong>REVISION DETAIL</strong><div><a href="https://phabricator.kde.org/D6392" rel="noreferrer">https://phabricator.kde.org/D6392</a></div></div><br /><div><strong>To: </strong>Zren, Plasma<br /><strong>Cc: </strong>broulik, plasma-devel, ZrenBot, progwolff, lesliezhai, ali-mohamed, jensreuterberg, abetts, sebas, apol, mart, lukas<br /></div>