WPF 自定义用户控件(Content根据加减按钮改变值)

时间:2024-10-09 07:19:06

 前端代码:

    <UserControl.Resources>
        <Style x:Key="Num_Button_Style" TargetType="Button">
            <Setter Property="MinWidth" Value="30" />
            <Setter Property="Height" Value="35" />
            <Setter Property="Margin" Value="0" />
            <Setter Property="VerticalContentAlignment" Value="Center" />
            <Setter Property="HorizontalContentAlignment" Value="Center" />
            <Setter Property="FontSize" Value="16" />
            <Setter Property="Foreground" Value="White" />
            <Setter Property="BorderThickness" Value="0" />
            <Setter Property="Background" Value="#12D269" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border
                            x:Name="border"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            SnapsToDevicePixels="True">
                            <TextBlock
                                HorizontalAlignment="Center"
                                VerticalAlignment="Center"
                                FontSize="{TemplateBinding FontSize}"
                                Foreground="{TemplateBinding Foreground}"
                                Text="{TemplateBinding Content}" />
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter TargetName="border" Property="Background" Value="#4662D9" />
                            </Trigger>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter TargetName="border" Property="Background" Value="#4662D9" />
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter TargetName="border" Property="Background" Value="#7Ec0EE" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="btnStyle" TargetType="Button">
            <Setter Property="Foreground" Value="#12D269" />
            <Setter Property="Width" Value="20" />
            <Setter Property="Height" Value="35" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Border
                            Name="PART_Background"
                            Background="Transparent"
                            BorderBrush="#12D269"
                            BorderThickness="1,1,0,1"
                            CornerRadius="3,0,0,3">
                            <ContentPresenter
                                HorizontalAlignment="Center"
                                VerticalAlignment="Center"
                                Content="{TemplateBinding ContentControl.Content}" />
                        </Border>
                    </ControlTemplate>
                </Setter.Value>

            </Setter>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="FontWeight" Value="Bold" />
                    <Setter Property="Cursor" Value="Hand" />
                    <Setter Property="Foreground" Value="Black" />

                </Trigger>
            </Style.Triggers>
        </Style>       
    </UserControl.Resources>
    <Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="3*" />
            <ColumnDefinition Width="1*" />
        </Grid.ColumnDefinitions>
        <Button
            x:Name="up"
            Grid.Column="2"
            Command="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=local:NumericUpDown}, Path=UpCommand}"
            CommandParameter="{Binding}"
            Content="+"
            Style="{StaticResource btnStyle}">
            <Button.Template>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Border
                        Name="PART_Background"
                        Background="Transparent"
                        BorderBrush="#12D269"
                        BorderThickness="0,1,1,1"
                        CornerRadius="0,3,3,0">
                        <ContentPresenter
                            HorizontalAlignment="Center"
                            VerticalAlignment="Center"
                            Content="{TemplateBinding ContentControl.Content}" />
                    </Border>
                </ControlTemplate>
            </Button.Template>
        </Button>
        <Button
            Grid.Column="1"
            MinWidth="50"
            Command="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=local:NumericUpDown}, Path=ConfirmCommand}"
            CommandParameter="{Binding}"
            Content="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=local:NumericUpDown}, Path=Text, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
            Style="{StaticResource Num_Button_Style}" />

        <Button
            x:Name="down"
            Grid.Column="0"
            Command="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=local:NumericUpDown}, Path=DownCommand}"
            CommandParameter="{Binding}"
            Content="-"
            Style="{StaticResource btnStyle}" />

    </Grid>

</UserControl>

后台注册的 属性及事件:

  public string Text 
  {
      get { return  (string)GetValue(TextProperty); }
      set { SetValue(TextProperty, value); }
  } 
  public static readonly DependencyProperty TextProperty =
  DependencyProperty.Register("Text", typeof(string), typeof(NumericUpDown), new PropertyMetadata(default(string)));

  private void Button_PreviewKeyDown(object sender, System.Windows.Input.KeyEventArgs e)
  {
      if (e.Key == Key.Enter)
      {
          e.Handled = true; // 禁用回车键
      }
  }

  public object CommandParameter
  {
      get
      {
          return GetValue(CommandParameterProperty);
      }
      set
      {
          SetValue(CommandParameterProperty, value);
      }
  }
  public static readonly DependencyProperty CommandParameterProperty =
      DependencyProperty.Register("CommandParemeter", typeof(object), typeof(NumericUpDown), new PropertyMetadata(default(object)));
 


  public ICommand UpCommand
  {
      get { return (ICommand)GetValue(UpCommandProperty); }
      set { SetValue(UpCommandProperty, value); }
  }

  public static readonly DependencyProperty UpCommandProperty =
      DependencyProperty.Register("UpCommand", typeof(ICommand), typeof(NumericUpDown), new PropertyMetadata(default(ICommand)));

  public ICommand DownCommand
  {
      get { return (ICommand)GetValue(DownCommandProperty); }
      set { SetValue(DownCommandProperty, value); }
  }

  public static readonly DependencyProperty DownCommandProperty =
      DependencyProperty.Register("DownCommand", typeof(ICommand), typeof(NumericUpDown), new PropertyMetadata(default(ICommand)));


  public ICommand ConfirmCommand
  {
      get { return (ICommand)GetValue(ConfirmCommandProperty); }
      set { SetValue(ConfirmCommandProperty, value); }
  }

  public static readonly DependencyProperty ConfirmCommandProperty =
     DependencyProperty.Register("ConfirmCommand", typeof(ICommand), typeof(NumericUpDown), new PropertyMetadata(default(ICommand)));

功能引用的部分:

<DataGrid
        Grid.Column="0"
        Height="{Binding ElementName=DGHeight, Path=ActualHeight}"
        AutoGenerateColumns="False"
        Background="White"
        CanUserReorderColumns="False"
        CanUserResizeColumns="False"
        CanUserResizeRows="False"
        HorizontalScrollBarVisibility="Hidden"
        IsReadOnly="True"
        ItemsSource="{Binding DataGridList_BindSources, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}"
        SelectedItem="{Binding SelectBindItem}"
        SelectionMode="Single"
        SelectionUnit="FullRow"
        VerticalScrollBarVisibility="Hidden">
        <DataGrid.ColumnHeaderStyle>
            <Style TargetType="DataGridColumnHeader">
                <Setter Property="HorizontalContentAlignment" Value="Center" />
                <Setter Property="Background" Value="#E8e8e8" />
                <Setter Property="BorderThickness" Value="1,1,1,1" />
                <Setter Property="BorderBrush" Value="#ffffff" />
                <Setter Property="Height" Value="50" />
            </Style>
        </DataGrid.ColumnHeaderStyle>
        <DataGrid.Columns>
            <DataGridTemplateColumn
                Width="50*"
                MinWidth="50"
                Header="BindName">
                <DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <Grid>
                            <TextBlock
                                HorizontalAlignment="Center"
                                VerticalAlignment="Center"
                                Text="{Binding BindName}" />
                        </Grid>
                    </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
            </DataGridTemplateColumn> 
            <DataGridTemplateColumn Width="550*" Header="Button"> 
                <DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch"> 
                            <Grid Margin="0,0,10,0">
                                <uc:NumericUpDown
									 ConfirmCommand="{Binding DataContext.NumvalueCommand, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=DataGrid}}"
									 DownCommand="{Binding DataContext.NumValueSubCommand, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=DataGrid}}"
									 IsEnabled="{Binding NumvalueBtnEnableLst, Converter={StaticResource ButtonEnable}, ConverterParameter=Numvalue_ADD, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
									 Text="{Binding Numvalue, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}"
									 UpCommand="{Binding DataContext.NumvalueAddCommand, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=DataGrid}}" />
                            </Grid>
                        </Grid>
                    </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
            </DataGridTemplateColumn>
        </DataGrid.Columns>
    </DataGrid>