Как полностью заменить содержимое кнопки WPF графическим путем?
-
03-07-2019 - |
Вопрос
Я деконструировал стандартную кнопку WPF с помощью Blend и сумел создать кнопку с красивым стилем, но не могу понять, как заставить путь заполнить внутреннюю часть пространства кнопки (ширину и высоту кнопки).Я также не уверен, нужно ли мне указывать ContentPresenter и даже правильно ли это.Мне нужен текст в середине кнопки (как обычно), но за ним находится мой графический путь.
Может ли кто-нибудь дать мне отзыв о том, как это сделать?Стиль определяется как;
<ControlTemplate x:Key="CurvedButton" TargetType="{x:Type Button}">
<Grid>
<Path Fill="#ff951c1f" Data="F1 M 64,16 C 64,24 56,31 48,31 L 15,31 C 7,31 0,24 0,16 C 0,7 7,0 15,0 L 48,0 C 56,0 64,7 64,16 Z" />
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Width="Auto" />
</Grid>
</ControlTemplate>
Использование этой кнопки;
<StackPanel>
<Button Template="{StaticResource CurvedButton}" FontFamily="MS Trebuchet" FontSize="40" Width="200" Height="120" Foreground="Black">XXXXXXXXXXX</Button>
</StackPanel>
Когда все будет готово, это должно выглядеть как изогнутая красная кнопка.
заранее спасибо
Райан
Решение
Есть несколько вещей, которые вы можете сделать, чтобы получить желаемые результаты.
Поместите путь в окно просмотра и растяните его до заполнения:
<ControlTemplate x:Key="CurvedButton" TargetType="{x:Type Button}">
<Grid>
<Viewbox Stretch="Fill">
<Path Fill="#ff951c1f" Data="F1 M 64,16 C 64,24 56,31 48,31 L 15,31 C 7,31 0,24 0,16 C 0,7 7,0 15,0 L 48,0 C 56,0 64,7 64,16 Z" />
</Viewbox>
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Width="Auto" />
</Grid>
</ControlTemplate>
Используйте границу вместо пути:
<ControlTemplate x:Key="CurvedButton" TargetType="{x:Type Button}">
<Grid>
<Border CornerRadius="40" Background="#ff951c1f">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Width="Auto" />
</Border>
</Grid>
</ControlTemplate>