스위치를 앞으로, 글씨를 뒤로

라벨을 72px 칸에 밀어 넣으니 "저장본 재조회" "재조회 무확인" 같은 이름이 두세 줄로 접혀
행이 뚱뚱해졌다. 참/거짓 행만 순서를 뒤집는다 — 스위치가 앞, 글씨가 뒤.

이러면 글씨가 남은 폭을 다 써서 접히지 않고, 스위치끼리 왼쪽에 모여 세로 축이 오히려 또렷해진다.
값을 적는 다른 행(라벨 + 입력)과 순서가 갈리는 것은 감수한다 — 스위치는 값을 '적는' 것이 아니라
'켜고 끄는' 것이라 애초에 다른 종류의 행이다.

라벨을 ToggleButton 의 Content 로 넣었다. 별도 TextBlock 으로 두면 글씨를 눌러도 아무 일이 없는데,
스위치 옆 글씨는 누르면 켜질 것으로 기대되는 자리다. 한 덩어리라 자동화 이름·키보드 조작도
그대로 하나로 유지된다. 호버하면 글씨도 함께 진해져 어디까지가 한 버튼인지 보인다.

'여러 값' 표시는 오른쪽 끝으로 뺐다 — 글씨 뒤에 붙이면 긴 라벨에서 밀려난다.

게이트: 테스트 267/267, --edit-smoke 237건 0실패, --query-popup 17/17, --maxrect 10/10,
--db-smoke 3000 diff 0·예외 0, --db-render P062 md5 8d683835f5d81e7bb41c79071d6bf954 동일,
--dialog-shots 57파일.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Msystech
2026-08-14 11:11:24 +09:00
co-authored by Claude Opus 5
parent a5083fd0bb
commit e82d520de6
+27 -8
View File
@@ -64,20 +64,39 @@
미끄러지지 않고 튄다: 이 저장소에는 Storyboard 가 한 곳도 없다. 여기만 움직이면 물성이 달라진다. 미끄러지지 않고 튄다: 이 저장소에는 Storyboard 가 한 곳도 없다. 여기만 움직이면 물성이 달라진다.
--> -->
<Style x:Key="SwitchToggle" TargetType="ToggleButton"> <Style x:Key="SwitchToggle" TargetType="ToggleButton">
<Setter Property="Width" Value="36"/>
<Setter Property="Height" Value="20"/>
<Setter Property="Cursor" Value="Hand"/> <Setter Property="Cursor" Value="Hand"/>
<Setter Property="FocusVisualStyle" Value="{x:Null}"/> <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
<Setter Property="HorizontalContentAlignment" Value="Left"/>
<Setter Property="Foreground" Value="{DynamicResource B.Muted}"/>
<Setter Property="FontSize" Value="12"/>
<Setter Property="Template"> <Setter Property="Template">
<Setter.Value> <Setter.Value>
<ControlTemplate TargetType="ToggleButton"> <ControlTemplate TargetType="ToggleButton">
<Border x:Name="track" CornerRadius="10" SnapsToDevicePixels="True" <!--
스위치가 앞, 글씨가 뒤다. 라벨을 72px 칸에 밀어 넣으면
"저장본 재조회" 같은 이름이 두세 줄로 접혀 행이 뚱뚱해진다.
앞으로 빼면 글씨가 남은 폭을 다 쓰고 스위치끼리 세로 축도 또렷해진다.
라벨까지 한 ToggleButton 안이라 글씨를 눌러도 켜진다.
-->
<DockPanel Background="Transparent">
<Border x:Name="track" DockPanel.Dock="Left" Width="36" Height="20"
CornerRadius="10" SnapsToDevicePixels="True"
VerticalAlignment="Center"
Background="{DynamicResource B.SwitchOff}" Background="{DynamicResource B.SwitchOff}"
BorderThickness="1" BorderBrush="Transparent"> BorderThickness="1" BorderBrush="Transparent">
<Ellipse x:Name="knob" Width="14" Height="14" Margin="3,0" <Ellipse x:Name="knob" Width="14" Height="14" Margin="3,0"
HorizontalAlignment="Left" VerticalAlignment="Center" HorizontalAlignment="Left" VerticalAlignment="Center"
Fill="{DynamicResource B.OnAccent}"/> Fill="{DynamicResource B.OnAccent}"/>
</Border> </Border>
<ContentPresenter Margin="8,0,0,0" VerticalAlignment="Center">
<ContentPresenter.Resources>
<Style TargetType="TextBlock">
<Setter Property="Foreground" Value="{Binding Foreground, RelativeSource={RelativeSource AncestorType=ToggleButton}}"/>
<Setter Property="TextTrimming" Value="CharacterEllipsis"/>
</Style>
</ContentPresenter.Resources>
</ContentPresenter>
</DockPanel>
<ControlTemplate.Triggers> <ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True"> <Trigger Property="IsChecked" Value="True">
<Setter TargetName="track" Property="Background" Value="{DynamicResource B.AccentFill}"/> <Setter TargetName="track" Property="Background" Value="{DynamicResource B.AccentFill}"/>
@@ -89,6 +108,7 @@
</Trigger> </Trigger>
<Trigger Property="IsMouseOver" Value="True"> <Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="track" Property="Opacity" Value="0.85"/> <Setter TargetName="track" Property="Opacity" Value="0.85"/>
<Setter Property="Foreground" Value="{DynamicResource B.Ink}"/>
</Trigger> </Trigger>
<Trigger Property="IsKeyboardFocused" Value="True"> <Trigger Property="IsKeyboardFocused" Value="True">
<Setter TargetName="track" Property="BorderBrush" Value="{DynamicResource B.Accent}"/> <Setter TargetName="track" Property="BorderBrush" Value="{DynamicResource B.Accent}"/>
@@ -499,14 +519,13 @@
</DataTemplate> </DataTemplate>
<DataTemplate DataType="{x:Type ins:ToggleRowViewModel}"> <DataTemplate DataType="{x:Type ins:ToggleRowViewModel}">
<DockPanel Margin="0,2"> <DockPanel Margin="0,3">
<TextBlock Text="{Binding Label}" Style="{StaticResource RowLabel}" ToolTip="{Binding Label}"/> <TextBlock DockPanel.Dock="Right" Style="{StaticResource MixedHint}"/>
<!-- 3상태: 다중선택에서 값이 갈리면 불확정(IsOn=null). 꺼짐으로 보이면 안 된다 --> <!-- 3상태: 다중선택에서 값이 갈리면 불확정(IsOn=null). 꺼짐으로 보이면 안 된다 -->
<ToggleButton Style="{StaticResource SwitchToggle}" <ToggleButton Style="{StaticResource SwitchToggle}"
IsChecked="{Binding IsOn}" IsThreeState="{Binding IsMixed, Mode=OneWay}" IsChecked="{Binding IsOn}" IsThreeState="{Binding IsMixed, Mode=OneWay}"
AutomationProperties.Name="{Binding Label}" Content="{Binding Label}" ToolTip="{Binding Label}"
HorizontalAlignment="Left" VerticalAlignment="Center"/> AutomationProperties.Name="{Binding Label}"/>
<TextBlock Style="{StaticResource MixedHint}"/>
</DockPanel> </DockPanel>
</DataTemplate> </DataTemplate>