Q&A
ButtonのStyleに指定しているButtonListStyleも見せてください。
概要
ボタンを複数表示させる下記のようなコードで、
・ボタンに表示する文字を中央寄せにしたい（現状：左寄せになる）
・ボタン同士をくっつけたい（現状：数ピクセル離れる）
のですが、それぞれの現状のようになってしまいます…
解決方法のごご教示をお願いします。
XAML
1<StackPanel Margin="20" VerticalAlignment="Center" DataContext="{Binding Source={StaticResource oHogePage}, Path=Sample}"> 2 <ListBox ItemsSource="{Binding}" Height="290" Background="#FFECECEC" BorderBrush="{x:Null}"> 3 <ListBox.ItemTemplate> 4 <DataTemplate> 5 <Button Background="White" Width="488" Height="35" FontSize="18" Click="Click_Button" Style="{DynamicResource ButtonListStyle}"> 6 <TextBlock Text="{Binding HogeHoge}" VerticalAlignment="Center" HorizontalAlignment="Center" /> 7 </Button> 8 </DataTemplate> 9 </ListBox.ItemTemplate> 10 </ListBox> 11 </StackPanel> 12 13
また、下記がButtonListStyleの中身です。
XAML
1<SolidColorBrush x:Key="Button.Static.Background" Color="#FFDDDDDD"/> 2 <SolidColorBrush x:Key="Button.Static.Border" Color="#FF707070"/> 3 <SolidColorBrush x:Key="Button.MouseOver.Background" Color="#FFBEE6FD"/> 4 <SolidColorBrush x:Key="Button.MouseOver.Border" Color="#FF3C7FB1"/> 5 <SolidColorBrush x:Key="Button.Pressed.Background" Color="#FFC4E5F6"/> 6 <SolidColorBrush x:Key="Button.Pressed.Border" Color="#FF2C628B"/> 7 <SolidColorBrush x:Key="Button.Disabled.Background" Color="#FFF4F4F4"/> 8 <SolidColorBrush x:Key="Button.Disabled.Border" Color="#FFADB2B5"/> 9 <SolidColorBrush x:Key="Button.Disabled.Foreground" Color="#FF838383"/> 10 <Style x:Key="ButtonListStyle" TargetType="{x:Type Button}"> 11 <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/> 12 <Setter Property="Background" Value="{StaticResource Button.Static.Background}"/> 13 <Setter Property="BorderBrush" Value="{StaticResource Button.Static.Border}"/> 14 <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 15 <Setter Property="BorderThickness" Value="1"/> 16 17 <Setter Property="Padding" Value="1"/> 18 <Setter Property="Template"> 19 <Setter.Value> 20 <ControlTemplate TargetType="{x:Type Button}"> 21 <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="true"> 22 <StackPanel Orientation="Horizontal"> 23 <ContentPresenter x:Name="contentPresenter" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 24 </StackPanel> 25 </Border> 26 <ControlTemplate.Triggers> 27 <Trigger Property="IsDefaulted" Value="true"> 28 <Setter Property="BorderBrush" TargetName="border" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/> 29 </Trigger> 30 <Trigger Property="IsMouseOver" Value="true"> 31 <Setter Property="Background" TargetName="border" Value="DarkGray"/> 32 <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.MouseOver.Border}"/> 33 </Trigger> 34 <Trigger Property="IsPressed" Value="true"> 35 <Setter Property="Background" TargetName="border" Value="{StaticResource Button.Pressed.Background}"/> 36 <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Pressed.Border}"/> 37 </Trigger> 38 <Trigger Property="IsEnabled" Value="false"> 39 <Setter Property="Background" TargetName="border" Value="{StaticResource Button.Disabled.Background}"/> 40 <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Disabled.Border}"/> 41 <Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="{StaticResource Button.Disabled.Foreground}"/> 42 </Trigger> 43 </ControlTemplate.Triggers> 44 </ControlTemplate> 45 </Setter.Value> 46 </Setter> 47 </Style>
動作環境
・ .NET Frame Work 4.5
・Visual Studio2013
よろしくお願いします。
回答1件
0
ベストアンサー
こんにちは。
エラー通すためにちょっと崩してしまいましたが、以下のような感じですかね。
XML
1<ListBox Height="290" Background="#FFECECEC" BorderBrush="{x:Null}"> 2 <ListBox.ItemsSource> 3 <x:Array Type="sys:String"> 4 <sys:String>aaa</sys:String> 5 <sys:String>bbb</sys:String> 6 </x:Array> 7 </ListBox.ItemsSource> 8 <ListBox.ItemTemplate> 9 <DataTemplate> 10 <Button Background="White" Width="488" Height="35" FontSize="18" 11 HorizontalContentAlignment="Left" VerticalContentAlignment="Top" Content="aaa" /> 12 </DataTemplate> 13 </ListBox.ItemTemplate> 14 <ListBox.ItemContainerStyle> 15 <Style TargetType="ListBoxItem"> 16 <Setter Property="Padding" Value="0" /> 17 <Setter Property="BorderThickness" Value="0" /> 18 </Style> 19 </ListBox.ItemContainerStyle> 20</ListBox>
ボタンの中はxxxContentAlignmentで調整できます。（上の例では左上に寄せました）
ListBoxItemのボーダーサイズなどを調整してボタン同士をくっつけてみました。これについては他に最適解があるかも。
XML
1<ControlTemplate TargetType="{x:Type Button}"> 2 <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="true"> 3 <!--<StackPanel Orientation="Horizontal">--> 4 <ContentPresenter x:Name="contentPresenter" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 5 <!--</StackPanel>--> 6 </Border>
ButtonListStyleがStackPanelで詰められているからですね。
投稿2015/11/27 03:52
編集2015/11/27 04:37
総合スコア4791
あなたの回答
tips
プレビュー
