Search code examples
wpfwpf-controlsscrollbarwpftoolkitnumericupdown

StringUpDown in WPF?


I have a question regarding the following question about NumericUpDown:

Good NumericUpDown equivalent in WPF?

How I can do this for 12 months of a year? I am planning to use a vertical ScrollBar with a textbox. I want to link the vertical ScrollBar up and down clicks to increment and decrement the months in the textbox using C#.

<ScrollBar x:Name="scbm" 
    HorizontalAlignment="Left" Height="26" Margin="230,195,0,0" 
    VerticalAlignment="Top" RenderTransformOrigin="0.542,0.83"/>

<TextBox x:Name="txtm" 
    HorizontalAlignment="Left" Height="23" Margin="139,195,0,0" 
    TextWrapping="Wrap" Text="" VerticalAlignment="Top" Width="66"/>

Can anyone tell me how I can accomplish this?


Solution

  • You can have a look This article that does something similar with a datepicker.

    Basically you'll want to have a property for the month, and depending on your approach (code behind / mvvm), handle the click events on the up/down buttons, or the keyboard keydown event to handle them logic (so in your case, add the up/down buttons, and wire them to the events, naming them appropriately).

    For example, having this on your xaml:

    <DatePicker ... PreviewKeyDown="PreviewKeyDown_EventHandler" ...  /> 
    

    And something like this in your code behind:

    private void PreviewKeyDown_EventHandler(object sender, System.Windows.Input.KeyEventArgs e)
    {
      // Avoid them nasty exceptions is the user hits "up" or "down" with no date selected:
      if (sender == null || ((DatePicker)sender).SelectedDate == null)
        return;
    
      // Do this on up 
      if (e.Key == Key.Up)
      {
         ((DatePicker)sender).SelectedDate =
        ((DatePicker)sender).SelectedDate.GetValueOrDefault().AddMonths(1);
      }
    
      // And this on down
      if (e.Key == Key.Down)
      {
        ((DatePicker)sender).SelectedDate =
        ((DatePicker)sender).SelectedDate.GetValueOrDefault().AddMonths(-1);
      }
    }
    

    That example uses a datetime as the property, but you can do similar things with an int if that's what you're after.

    (again, have a look at the link for more options, examples, and code example if you'd like)


    Edit:

    This doesn't have theh benefits of the up/down keys like the article's example, but this works:

    <ScrollBar x:Name="scbm" 
        SmallChange="1" Maximum="12" Minimum="1"
    
        Value="{Binding MonthScrollBar}"
        HorizontalAlignment="Left" Height="26" Margin="230,195,0,0" 
        VerticalAlignment="Top" RenderTransformOrigin="0.542,0.83" />
    
    <TextBox x:Name="txtm" 
        Text="{Binding MonthScrollBar}"
    
        HorizontalAlignment="Left" Height="23" Margin="139,195,0,0" 
        TextWrapping="Wrap"  VerticalAlignment="Top" Width="66" />
    

    On my ViewModel (or your codebehind, if you want, do something similar)

    public int MonthScrollBar
    {
        get { return _monthScrollBar; }
        set { _monthScrollBar = value; 
              RaisePropertyChanged("MonthScrollBar");}
    }
    private int _monthScrollBar;
    

    And setting the property value to whatever you want on the constructor.

    Note that I'm using MVVM, binding to a property with notification change (so changes are propagating to the View), and initializing it. Both the ScrollBar and TextBox bind to the same MonthScrollBar property) If you're doing code behind, you can access it directly from the code behind.