WPF Numeric UpDown control อยู่ที่ไหน


124

เข้าสู่โครงการ WPF ที่จริงจังครั้งแรก ดูเหมือนว่าจะมีการควบคุมพื้นฐานหลายอย่างที่ขาดหายไป โดยเฉพาะฉันกำลังมองหาการควบคุมการขึ้นลงของตัวเลข มีการปล่อยนอกวงไหมที่ฉันพลาด? ไม่รู้สึกเหมือนเขียนการควบคุมของตัวเองเลยจริงๆ

ฉันไม่ต้องการใช้ WindowsFormHost และใช้ WinForm ctl ฉันต้องการให้มันเป็น WPF อย่างสมบูรณ์โดยไม่มีขยะเดิม

ขอบคุณ


4
ชุดเครื่องมือ WPF แบบขยายมีหนึ่ง: NumericUpDown ! ข้อความแสดงแทน
Eduardo Molteni

21
ความคิดเห็นเดียวนี้เป็นตัวขับเคลื่อนการเข้าชมบล็อกของฉันมากที่สุดตลอดกาล จนถึงทุกวันนี้ เฮฮา.
Kevin Moore

1
เป็นไปได้ที่จะซ้ำกันของGood NumericUpDown ที่เทียบเท่าใน WPF?
เจค

3
คำถามคือ "ตัวควบคุมการขึ้นลงตัวเลข WPF อยู่ที่ไหน" ไม่มีคำตอบใดที่ตอบคำถามนั้น ฉันคาดหวังว่าคำตอบจะอยู่ในรูปแบบ "พวกเขาตัดสินใจที่จะกำจัดมันใน wpf เพราะ ... " ฉันไม่รู้คำตอบนี้อย่างไร
Assimilater

2
WPF Toolkit ทำให้เกิดปัญหามากกว่าที่จะแก้ได้มันมีข้อบกพร่องที่ชัดเจนอยู่เล็กน้อย และไม่มีการควบคุม NumericUpDown จาก Microsoft ... นรก WPF ยังมีชีวิตอยู่อีกต่อไปหรือไม่?
j00hi

คำตอบ:


48

เพียงใช้การIntegerUpDownควบคุมในชุดเครื่องมือ wpf xtended คุณสามารถใช้งานได้ดังนี้:

  1. เพิ่มเนมสเปซต่อไปนี้ใน XAML ของคุณ:

    xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"

  2. ใน XAML ของคุณที่คุณต้องการให้ใช้การควบคุม:

    <xctk:IntegerUpDown Name="myUpDownControl" />


6
สำหรับผู้ที่สงสัย / ไม่สะดวกกับการควบคุมแหล่งที่มาแบบปิดของบุคคลที่สามโปรดทราบว่าไลบรารีรุ่นฟรีนี้เผยแพร่ภายใต้ Microsoft Public License ซึ่งโดยทั่วไปหมายความว่าคุณจะได้รับซอร์สโค้ดแบบเต็มด้านหลัง (อ่านรายละเอียดข้อความใบอนุญาตฉบับเต็ม) การควบคุม UpDown เป็นส่วนหนึ่งของเวอร์ชันฟรี นอกจากนี้ยังมีไลบรารีเวอร์ชันชำระเงินที่มีการควบคุม / ธีมเพิ่มเติมมากมาย
60

มีวิธีใดที่จะทำให้การควบคุม WPF แบบกำหนดเองเหล่านี้แสดงใน VS Toolbox เพื่อความสะดวก? ฉันไม่พบสิ่งเหล่านี้ใน 'เครื่องมือ -> เลือกรายการกล่องเครื่องมือ'
นักบิน

2
ควรสังเกตว่าตั้งแต่เวอร์ชัน v3.7.0 เป็นต้นไป wpftoolkit เวอร์ชันโอเพนซอร์สนั้นมีให้ภายใต้ใบอนุญาตที่ไม่ใช่เชิงพาณิชย์ที่เป็นกรรมสิทธิ์แทนที่จะเป็น MS-PL ( อ้างอิง )
Jordoff

46

ฉันทำของฉันเอง

xaml

<StackPanel Orientation="Horizontal">
    <TextBox x:Name="txtNum" x:FieldModifier="private" Margin="5,5,0,5" Width="50" Text="0" TextChanged="txtNum_TextChanged" />
    <Button x:Name="cmdUp" x:FieldModifier="private" Margin="5,5,0,5" Content="˄" Width="20" Click="cmdUp_Click" />
    <Button x:Name="cmdDown" x:FieldModifier="private" Margin="0,5,0,5"  Content="˅" Width="20" Click="cmdDown_Click" />
</StackPanel>

และรหัสด้านหลัง

private int _numValue = 0;

public int NumValue
{
    get {  return _numValue; }
    set
    {
        _numValue = value;
        txtNum.Text = value.ToString();
    }
}

public NumberUpDown()
{
    InitializeComponent();
    txtNum.Text = _numValue.ToString();
}

private void cmdUp_Click(object sender, RoutedEventArgs e)
{
    NumValue++;
}

private void cmdDown_Click(object sender, RoutedEventArgs e)
{
    NumValue--;
}

private void txtNum_TextChanged(object sender, TextChangedEventArgs e)
{
    if (txtNum == null)
    {
        return;
    }

    if (!int.TryParse(txtNum.Text, out _numValue))
        txtNum.Text = _numValue.ToString();
}

ไม่มีเหตุการณ์ textChanged สำหรับ textbox ใน WPF .net 4
AliR

วิธีการนี้มีข้อ จำกัด บางอย่าง 1) กล่องข้อความไม่ยืดแนวนอนที่มีการควบคุมเช่น Winforms หนึ่งไม่น้อยและที่สำคัญ 2) แตกต่างจาก Winforms NumericUpDown ควบคุมนี้จะช่วยให้แนวตั้งยืดซึ่งไม่เป็นอันตราย แต่มันดูโง่บิต โปรดทราบว่าวิธีแก้ปัญหาในคำตอบของ Sonorxไม่มีปัญหาเหล่านี้
jrh

2
NumValue ควรเป็นคุณสมบัติที่ขึ้นต่อกันเพื่ออนุญาตการเชื่อมโยงนอกจากนี้คุณสมบัติอื่น ๆ เช่น MinValue และ MaxValue ก็จะดี
Konrad

วิธีแก้นี้เป็นง่อย เป็นการควบคุมแบบกำหนดเองโดยไม่รองรับการผูกข้อมูล wpf เหตุการณ์ที่กำหนดเส้นทางและคำสั่ง
Xam

18

นี่คือตัวอย่างของ UserControl ของฉันเองด้วยการจับคีย์ขึ้นและลง

รหัส Xaml:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="13" />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="13" />
        <RowDefinition Height="13" />
    </Grid.RowDefinitions>
    <TextBox Name="NUDTextBox"  Grid.Column="0" Grid.Row="0" Grid.RowSpan="2" TextAlignment="Right" PreviewKeyDown="NUDTextBox_PreviewKeyDown" PreviewKeyUp="NUDTextBox_PreviewKeyUp" TextChanged="NUDTextBox_TextChanged"/>
    <RepeatButton Name="NUDButtonUP"  Grid.Column="1" Grid.Row="0" FontSize="8" FontFamily="Marlett" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" Click="NUDButtonUP_Click">5</RepeatButton>
    <RepeatButton Name="NUDButtonDown"  Grid.Column="1" Grid.Row="1" FontSize="8"  FontFamily="Marlett" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" Height="13" VerticalAlignment="Bottom" Click="NUDButtonDown_Click">6</RepeatButton>
</Grid>

และรหัส:

public partial class NumericUpDown : UserControl
{
    int minvalue = 0, 
        maxvalue = 100,
        startvalue = 10;
    public NumericUpDown()
    {
        InitializeComponent();
        NUDTextBox.Text = startvalue.ToString();
    }

    private void NUDButtonUP_Click(object sender, RoutedEventArgs e)
    {
        int number;
        if (NUDTextBox.Text != "") number = Convert.ToInt32(NUDTextBox.Text);
        else number = 0;
        if (number < maxvalue)
            NUDTextBox.Text = Convert.ToString(number + 1); 
    }

    private void NUDButtonDown_Click(object sender, RoutedEventArgs e)
    {
        int number;
        if (NUDTextBox.Text != "") number = Convert.ToInt32(NUDTextBox.Text);
        else number = 0;
        if (number > minvalue)
            NUDTextBox.Text = Convert.ToString(number - 1); 
    }

    private void NUDTextBox_PreviewKeyDown(object sender, KeyEventArgs e)
    {

        if (e.Key == Key.Up)
        {
            NUDButtonUP.RaiseEvent(new RoutedEventArgs(Button.ClickEvent));
            typeof(Button).GetMethod("set_IsPressed", BindingFlags.Instance | BindingFlags.NonPublic).Invoke(NUDButtonUP, new object[] { true }); 
        }


        if (e.Key == Key.Down)
        {
            NUDButtonDown.RaiseEvent(new RoutedEventArgs(Button.ClickEvent));
            typeof(Button).GetMethod("set_IsPressed", BindingFlags.Instance | BindingFlags.NonPublic).Invoke(NUDButtonDown, new object[] { true }); 
        }
    }

    private void NUDTextBox_PreviewKeyUp(object sender, KeyEventArgs e)
    {
        if (e.Key == Key.Up)
            typeof(Button).GetMethod("set_IsPressed", BindingFlags.Instance | BindingFlags.NonPublic).Invoke(NUDButtonUP, new object[] { false });

        if (e.Key == Key.Down)
            typeof(Button).GetMethod("set_IsPressed", BindingFlags.Instance | BindingFlags.NonPublic).Invoke(NUDButtonDown, new object[] { false });
    }

    private void NUDTextBox_TextChanged(object sender, TextChangedEventArgs e)
    {
        int number = 0;
        if (NUDTextBox.Text!="")
            if (!int.TryParse(NUDTextBox.Text, out number)) NUDTextBox.Text = startvalue.ToString();
        if (number > maxvalue)  NUDTextBox.Text = maxvalue.ToString();
        if (number < minvalue) NUDTextBox.Text = minvalue.ToString();
        NUDTextBox.SelectionStart = NUDTextBox.Text.Length;

    }

}

2
แบบอักษร "Marlett" รับประกันว่ามีอยู่ในระบบของผู้ใช้หรือไม่?
Qwertie

@Qwertie เป็นค่าเริ่มต้นใน Windows ตั้งแต่ 3.11, AFAIR
Spook

นี่เป็นทางออกที่ดีและดูเหมือนว่าจะใช้ได้กับ UWP XAML ด้วย เพิ่งมีปัญหาเล็กน้อยกับเมธอด PreviewKeyDown / PreviewKeyUP
raddevus

10
<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:numericButton2">


    <Style TargetType="{x:Type local:NumericUpDown}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type local:NumericUpDown}">              
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="*"/>
                                <RowDefinition Height="*"/>
                                <RowDefinition Height="*"/>
                            </Grid.RowDefinitions>
                            <RepeatButton Grid.Row="0" Name="Part_UpButton"/>
                            <ContentPresenter Grid.Row="1"></ContentPresenter>
                            <RepeatButton Grid.Row="2" Name="Part_DownButton"/>
                        </Grid>                  
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>

    <Window x:Class="numericButton2.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:local="clr-namespace:numericButton2"
            Title="MainWindow" Height="350" Width="525">
        <Grid>
            <local:NumericUpDown Margin="181,94,253,161" x:Name="ufuk" StepValue="4" Minimum="0" Maximum="20">            
            </local:NumericUpDown>
            <TextBlock Margin="211,112,279,0" Text="{Binding ElementName=ufuk, Path=Value}" Height="20" VerticalAlignment="Top"></TextBlock>
        </Grid>
    </Window>
public class NumericUpDown : Control
{
    private RepeatButton _UpButton;
    private RepeatButton _DownButton;
    public readonly static DependencyProperty MaximumProperty;
    public readonly static DependencyProperty MinimumProperty;
    public readonly static DependencyProperty ValueProperty;
    public readonly static DependencyProperty StepProperty;   
    static NumericUpDown()
    {
        DefaultStyleKeyProperty.OverrideMetadata(typeof(NumericUpDown), new FrameworkPropertyMetadata(typeof(NumericUpDown)));
        MaximumProperty = DependencyProperty.Register("Maximum", typeof(int), typeof(NumericUpDown), new UIPropertyMetadata(10));
        MinimumProperty = DependencyProperty.Register("Minimum", typeof(int), typeof(NumericUpDown), new UIPropertyMetadata(0));
        StepProperty = DependencyProperty.Register("StepValue", typeof(int), typeof(NumericUpDown), new FrameworkPropertyMetadata(5));
        ValueProperty = DependencyProperty.Register("Value", typeof(int), typeof(NumericUpDown), new FrameworkPropertyMetadata(0));
    }
    #region DpAccessior
    public int Maximum
    {
        get { return (int)GetValue(MaximumProperty); }
        set { SetValue(MaximumProperty, value); }
    }
    public int Minimum
    {
        get { return (int)GetValue(MinimumProperty); }
        set { SetValue(MinimumProperty, value); }
    }
    public int Value
    {
        get { return (int)GetValue(ValueProperty); }
        set { SetCurrentValue(ValueProperty, value); }
    }
    public int StepValue
    {
        get { return (int)GetValue(StepProperty); }
        set { SetValue(StepProperty, value); }
    }
    #endregion
    public override void OnApplyTemplate()
    {
        base.OnApplyTemplate();
        _UpButton = Template.FindName("Part_UpButton", this) as RepeatButton;
        _DownButton = Template.FindName("Part_DownButton", this) as RepeatButton;
        _UpButton.Click += _UpButton_Click;
        _DownButton.Click += _DownButton_Click;
    }

    void _DownButton_Click(object sender, RoutedEventArgs e)
    {
        if (Value > Minimum)
        {
            Value -= StepValue;
            if (Value < Minimum)
                Value = Minimum;
        }
    }

    void _UpButton_Click(object sender, RoutedEventArgs e)
    {
        if (Value < Maximum)
        {
            Value += StepValue;
            if (Value > Maximum)
                Value = Maximum;
        }
    }

}

9

คำตอบที่ได้รับนั้นใช้ได้ อย่างไรก็ตามฉันต้องการให้ปุ่มต่างๆซ่อนอัตโนมัติเมื่อเมาส์ออกจากการควบคุม นี่คือรหัสของฉันตามคำตอบของvercinด้านบน:

สไตล์

<Style TargetType="{x:Type v:IntegerTextBox}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type v:IntegerTextBox}">
                    <Grid Background="Transparent">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="*"/>
                            <RowDefinition Height="*"/>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="Auto"/>
                        </Grid.ColumnDefinitions>
                        <TextBox Name="tbmain" Grid.ColumnSpan="2" Grid.RowSpan="2"
                                 Text="{Binding Value, Mode=TwoWay, NotifyOnSourceUpdated=True, 
                            NotifyOnValidationError=True, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type v:IntegerTextBox}}}" 
                                               Style="{StaticResource ValidationStyle}" />
                        <RepeatButton Name="PART_UpButton" BorderThickness="0" Grid.Column="1" Grid.Row="0"
                                      Width="13" Background="Transparent">
                            <Path Fill="Black" Data="M 0 3 L 6 3 L 3 0 Z"/>
                        </RepeatButton>
                        <RepeatButton Name="PART_DownButton" BorderThickness="0" Grid.Column="1" Grid.Row="1"
                                      Width="13" Background="Transparent">
                            <Path Fill="Black" Data="M 0 0 L 3 3 L 6 0 Z"/>
                        </RepeatButton>

                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver"  Value="False">
                            <Setter Property="Visibility" TargetName="PART_UpButton" Value="Collapsed"/>
                            <Setter Property="Visibility" TargetName="PART_DownButton" Value="Collapsed"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

รหัส

public partial class IntegerTextBox : UserControl
{
    public IntegerTextBox()
    {
        InitializeComponent();
    }

    public int Maximum
    {
        get { return (int)GetValue(MaximumProperty); }
        set { SetValue(MaximumProperty, value); }
    }
    public readonly static DependencyProperty MaximumProperty = DependencyProperty.Register(
        "Maximum", typeof(int), typeof(IntegerTextBox), new UIPropertyMetadata(int.MaxValue));



    public int Minimum
    {
        get { return (int)GetValue(MinimumProperty); }
        set { SetValue(MinimumProperty, value); }
    }
    public readonly static DependencyProperty MinimumProperty = DependencyProperty.Register(
        "Minimum", typeof(int), typeof(IntegerTextBox), new UIPropertyMetadata(int.MinValue));


    public int Value
    {
        get { return (int)GetValue(ValueProperty); }
        set { SetCurrentValue(ValueProperty, value); }
    }
    public readonly static DependencyProperty ValueProperty = DependencyProperty.Register(
        "Value", typeof(int), typeof(IntegerTextBox), new UIPropertyMetadata(0, (o,e)=>
        {
            IntegerTextBox tb = (IntegerTextBox)o;
            tb.RaiseValueChangedEvent(e);
        }));

    public event EventHandler<DependencyPropertyChangedEventArgs> ValueChanged;
    private void RaiseValueChangedEvent(DependencyPropertyChangedEventArgs e)
    {
        ValueChanged?.Invoke(this, e);
    }


    public int Step
    {
        get { return (int)GetValue(StepProperty); }
        set { SetValue(StepProperty, value); }
    }
    public readonly static DependencyProperty StepProperty = DependencyProperty.Register(
        "Step", typeof(int), typeof(IntegerTextBox), new UIPropertyMetadata(1));



    RepeatButton _UpButton;
    RepeatButton _DownButton;
    public override void OnApplyTemplate()
    {
        base.OnApplyTemplate();
        _UpButton = Template.FindName("PART_UpButton", this) as RepeatButton;
        _DownButton = Template.FindName("PART_DownButton", this) as RepeatButton;
        _UpButton.Click += btup_Click;
        _DownButton.Click += btdown_Click;
    }


    private void btup_Click(object sender, RoutedEventArgs e)
    {
        if (Value < Maximum)
        {
            Value += Step;
            if (Value > Maximum)
                Value = Maximum;
        }
    }

    private void btdown_Click(object sender, RoutedEventArgs e)
    {
        if (Value > Minimum)
        {
            Value -= Step;
            if (Value < Minimum)
                Value = Minimum;
        }
    }

}

คำตอบที่ดีที่สุดที่นี่ การใช้คุณสมบัติการพึ่งพาอย่างเหมาะสม
Konrad

5

ใช้VerticalScrollBarกับตัวTextBlockควบคุมใน WPF ในโค้ดของคุณด้านหลังให้เพิ่มรหัสต่อไปนี้:

ในตัวสร้างกำหนดตัวจัดการเหตุการณ์สำหรับแถบเลื่อน:

scrollBar1.ValueChanged += new RoutedPropertyChangedEventHandler<double>(scrollBar1_ValueChanged);
scrollBar1.Minimum = 0;
scrollBar1.Maximum = 1;
scrollBar1.SmallChange = 0.1;

จากนั้นในตัวจัดการเหตุการณ์ให้เพิ่ม:

void scrollBar1_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
{
    FteHolderText.Text = scrollBar1.Value.ToString();
}

นี่คือตัวอย่างต้นฉบับจากโค้ดของฉัน ... ทำการเปลี่ยนแปลงที่จำเป็น .. :)

public NewProjectPlan()
{
    InitializeComponent();

    this.Loaded += new RoutedEventHandler(NewProjectPlan_Loaded);

    scrollBar1.ValueChanged += new RoutedPropertyChangedEventHandler<double>(scrollBar1_ValueChanged);
    scrollBar1.Minimum = 0;
    scrollBar1.Maximum = 1;
    scrollBar1.SmallChange = 0.1;

    // etc...
}

void scrollBar1_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
{
    FteHolderText.Text = scrollBar1.Value.ToString();
}

1
โซลูชันของคุณฉลาดมากอย่างไรก็ตามปุ่มต่างๆทำงานในลำดับย้อนกลับ (ปุ่มขึ้นจะลดค่าในขณะที่ปุ่มลงจะเพิ่มขึ้น) ฉันพบชุดข้อความอื่นที่อาจช่วยในการแก้ปัญหานั้น: stackoverflow.com/a/27246296/637968 - เพียงแค่หมุนแถบเลื่อน
ไมค์

5

คุณสามารถใช้การควบคุม NumericUpDown สำหรับ WPF ที่เขียนโดยฉันเป็นส่วนหนึ่งของไลบรารีWPFControls


ห้องสมุดเล็ก ๆ ที่ดีและแสดงให้เห็นว่าควรเขียนตัวเลขขึ้น / ลงควบคุมอย่างไร ปัญหาเดียวที่ฉันมีคือต้องอ้างอิงชุดควบคุมอีกครั้งในการสาธิตและติดตั้ง MSHTML จาก nuget ขอบคุณ!
sergeantKK

เยี่ยมมากกับห้องสมุด มีประโยชน์มาก. ขอบคุณ
namg_engr

5

ขอโทษที่ตอบคำถามตลอด 9 ปี

ฉันได้ทำตามคำตอบของ @ มิเชลและได้ผล

ฉันทำมันในฐานะ UserControl ซึ่งฉันสามารถลากและวางเหมือนองค์ประกอบ Controls ฉันใช้ MaterialDesign Theme จาก Nuget เพื่อรับไอคอนเชฟรอนและเอฟเฟกต์ระลอกปุ่ม

NumericUpDown ที่รันจาก Micheal พร้อมการปรับเปลี่ยนจะเป็นดังนี้: -

ใส่คำอธิบายภาพที่นี่

รหัสสำหรับการควบคุมผู้ใช้: -

TemplateNumericUpDown.xaml

<UserControl x:Class="UserControlTemplate.TemplateNumericUpDown"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:UserControlTemplate"
             xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
             mc:Ignorable="d" MinHeight="48">
    <Grid Background="{DynamicResource {x:Static SystemColors.WindowFrameBrushKey}}">
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition Width="60"/>
        </Grid.ColumnDefinitions>
        <TextBox x:Name="txtNum" x:FieldModifier="private" Text="{Binding Path=NumValue}" TextChanged="TxtNum_TextChanged" FontSize="36" BorderThickness="0" VerticalAlignment="Center" Padding="5,0"/>
        <Grid Grid.Column="1">
            <Grid.RowDefinitions>
                <RowDefinition Height="30*"/>
                <RowDefinition Height="30*"/>
            </Grid.RowDefinitions>
            <Grid Background="#FF673AB7">
                <Viewbox HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Height="Auto" Width="Auto">
                    <materialDesign:PackIcon Kind="ChevronUp" Foreground="White" Height="32.941" Width="32"/>
                </Viewbox>
                <Button x:Name="cmdUp" x:FieldModifier="private" Click="CmdUp_Click" Height="Auto" BorderBrush="{x:Null}" Background="{x:Null}"/>
            </Grid>
            <Grid Grid.Row="1" Background="#FF673AB7">
                <Viewbox HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Height="Auto" Width="Auto">
                    <materialDesign:PackIcon Kind="ChevronDown" Foreground="White" Height="32.942" Width="32"/>
                </Viewbox>
                <Button x:Name="cmdDown" x:FieldModifier="private" Click="CmdDown_Click" Height="Auto" BorderBrush="{x:Null}" Background="{x:Null}"/>
            </Grid>
        </Grid>
    </Grid>
</UserControl>

TemplateNumericUpDown.cs

using System.Windows;
using System.Windows.Controls;

namespace UserControlTemplate
{
    /// <summary>
    /// Interaction logic for TemplateNumericUpDown.xaml
    /// </summary>
    public partial class TemplateNumericUpDown : UserControl
    {
        private int _numValue = 0;
        public TemplateNumericUpDown()
        {
            InitializeComponent();
            txtNum.Text = _numValue.ToString();
        }
        public int NumValue
        {
            get { return _numValue; }
            set
            {
                if (value >= 0)
                {
                    _numValue = value;
                    txtNum.Text = value.ToString();
                }
            }
        }

        private void CmdUp_Click(object sender, RoutedEventArgs e)
        {
            NumValue++;
        }

        private void CmdDown_Click(object sender, RoutedEventArgs e)
        {
            NumValue--;
        }

        private void TxtNum_TextChanged(object sender, TextChangedEventArgs e)
        {
            if (txtNum == null)
            {
                return;
            }

            if (!int.TryParse(txtNum.Text, out _numValue))
                txtNum.Text = _numValue.ToString();
        }
    }
}

บน MyPageDesign.xaml ลากและวางที่สร้าง usercontrol จะมี <UserControlTemplate:TemplateNumericUpDown HorizontalAlignment="Left" Height="100" VerticalAlignment="Top" Width="100"/>

ใส่คำอธิบายภาพที่นี่

เพื่อรับค่าจากเทมเพลตฉันใช้

string Value1 = JournalNumStart.NumValue;
string Value2 = JournalNumEnd.NumValue;

ฉันยังไม่ถนัดในการผูกความสูงของตัวควบคุมตามองค์ประกอบ FontSize ดังนั้นฉันจึงตั้งค่าขนาดแบบอักษรจากหน้าของฉันด้วยตนเองใน usercontrol

** หมายเหตุ: - ฉันได้เปลี่ยนชื่อ "Archieve" เป็น Archive ในโปรแกรมของฉัน =)


การใช้งานปุ่มขึ้น / ลงนั้นแย่มาก: มีขนาดเล็กเกินไปที่จะใช้งานได้จริง ต้องมีความสูงอย่างน้อยเท่ากับกล่องข้อความ (และเป็นสี่เหลี่ยมจัตุรัส) ฉันรู้ว่ามันใช้พื้นที่มากกว่าเล็กน้อย แต่มันให้ปุ่มที่ใช้งานได้น้อย มิฉะนั้นจะไม่มีเหตุผลที่จะแทรกพวกเขาเลย
Vincent

3

ฉันมีทางออกที่ไร้เดียงสา แต่มีประโยชน์ นี่คือรหัส:

<Grid Name="TVGrid" Background="#7F000000">  <ScrollBar Background="Black" Orientation="Vertical" Height="35" HorizontalAlignment="Left" Margin="215,254,0,0" Minimum="0" Maximum="10" LargeChange="10" Value="{Binding ElementName=channeltext2, Path=Text}" x:Name="scroll" VerticalAlignment="Top" Width="12" RenderTransformOrigin="0.5,0.5" ValueChanged="scroll_ValueChanged" >  
        <ScrollBar.RenderTransform>  
            <TransformGroup>  
                <ScaleTransform/>  
                <SkewTransform/>  
                <RotateTransform Angle="-180"/>  
                <TranslateTransform/>  
            </TransformGroup>  
        </ScrollBar.RenderTransform>  
    </ScrollBar>  
    <TextBox Name="channeltext" HorizontalContentAlignment="Center" FontSize="20"  Background="Black" Foreground="White" Height="35" HorizontalAlignment="Left" Margin="147,254,0,0" VerticalAlignment="Top" Width="53" Text="0" />  
    <TextBox Name="channeltext2" Visibility="Hidden" HorizontalContentAlignment="Center" FontSize="20"  Background="Black" Foreground="White" Height="35" HorizontalAlignment="Left" Margin="147,254,0,0" VerticalAlignment="Top" Width="53" Text="0" />  </Grid>  

3

นี่คือการควบคุมโอเพนซอร์สอีกตัวหนึ่งที่มีวิธีการป้อนข้อมูลที่แตกต่างกัน (การลากเมาส์ล้อเลื่อนของเมาส์ปุ่มเคอร์เซอร์การแก้ไขกล่องข้อความ) รองรับข้อมูลหลายประเภทและกรณีการใช้งาน:

https://github.com/Dirkster99/NumericUpDownLib


1

เป็นเพียงแนวทางปฏิบัติในการทำตัวอย่าง:

- คลิกขวาที่โครงการของคุณ(ภายใต้โซลูชัน) เลือก "จัดการแพ็คเกจ nuget ... "

- ในเมนูคลิกเรียกดูแท็บค้นหา "wpftoolkit" เลือก " Extended.Wpf.Toolkit"

- ติดตั้ง!

- คลิกขวาในกล่องเครื่องมือควบคุมผู้ใช้ของคุณเลือก "เพิ่มแท็บ .. " และตั้งชื่อว่า "WPF Toolkit"

- คลิกขวาที่แท็บ "WPF Toolkit" ใหม่เลือก "เลือกรายการ ... "

- ในเมนูคลิกปุ่ม "เรียกดู ... " ค้นหาโฟลเดอร์ DLL ของนักเก็ตเลือกทั้งหมด " ...\packages\Extended.Wpf.Toolkit.3.5.0\lib\net40\*.dll"

ละเว้นคำเตือนเกี่ยวกับ DLL บางตัวอาจไม่มีการควบคุมของผู้ใช้!

พร้อมแล้ว :)


0

ไปที่ NugetPackage manager ของคุณ project-> เรียกดูและค้นหา mahApps.Metro -> ติดตั้งแพ็คเกจในโปรเจ็กต์ของคุณ คุณจะเห็นการอ้างอิงเพิ่ม: MahApps.Metro จากนั้นในรหัส XAML ของคุณเพิ่ม:

"xmlns:mah="http://metro.mahapps.com/winfx/xaml/controls"

ตำแหน่งที่คุณต้องการใช้เพิ่มวัตถุของคุณ:

<mah:NumericUpDown x:Name="NumericUpDown" ... /> 

เพลิดเพลินไปกับความสามารถในการขยายวัตถุอย่างเต็มที่ (การเชื่อมโยงทริกเกอร์และอื่น ๆ ... )

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.