Berial
Berial

Reputation: 557

WPF custom shape control

I was wondering if it is possible to make a custom shape custom control. I need to make control which contains textbox, however the control must have a shape of triangle or sth more sophisticated than regular rectangle/square.

Upvotes: 1

Views: 3846

Answers (1)

Short answer is yes. Long answer is reading up on WPF Control Styles:

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="WpfApplication1.MainWindow"
    x:Name="Window"
    Title="MainWindow"
    Width="640" 
    Height="480">

    <Window.Resources>
        <Style x:Key="TextBoxSample" TargetType="{x:Type TextBox}">
            <Setter Property="FontWeight" Value="Bold"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TextBox}">
                        <Grid>
                            <Ellipse 
                                x:Name="Border" 
                                Stroke="#FF393785" 
                                StrokeThickness="2"
                                >
                                <Ellipse.Fill>
                                    <RadialGradientBrush GradientOrigin="0.25,0.25" RadiusY="0.75" RadiusX="0.75">
                                        <GradientStop Color="White" Offset="0.2"/>
                                        <GradientStop Color="#FF2EC452" Offset="0.5"/>
                                        <GradientStop Color="#FF606060" Offset="1"/>
                                    </RadialGradientBrush>
                                </Ellipse.Fill>
                                </Ellipse>                              
                            <!-- The implementation places the Content into the ScrollViewer. It must be named PART_ContentHost for the control to function -->
                            <ScrollViewer 
                                x:Name="PART_ContentHost" 
                                Background="Transparent"
                                HorizontalAlignment="Center"
                                VerticalAlignment="Center"
                                />
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter Property="Fill" Value="#000" TargetName="Border"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

    </Window.Resources>
    <Grid x:Name="LayoutRoot">
        <TextBox 
            Style="{StaticResource TextBoxSample}"
            VerticalAlignment="Center"
            HorizontalAlignment="Center" 
            Text="TextBox" 
            Width="180" 
            Height="180"
            />
    </Grid>
</Window>

Upvotes: 2

Related Questions