MVVM: how to build a control with databinding or enter key in a TextBox

Public forum to share code snippets, screen shorts, experiences, etc.
Post Reply
User avatar
wriedmann
Posts: 3755
Joined: Mon Nov 02, 2015 5:07 pm
Location: Italy

MVVM: how to build a control with databinding or enter key in a TextBox

Post by wriedmann »

If you need to build user friendly applications, for sure you need to react also on specific key presses in a TextBox control.
MVVM requires you to use DataBinding.

This is the source for such a control, a sample with the full source is attached as XIDE application export file.

Code: Select all

using System.Windows
using System.Windows.Controls
using System.Windows.Input

class EnterTextBox inherit TextBox 
protect _oEnterCommand as ICommand
public static initonly EnterCommandProperty as DependencyProperty
	
static constructor()

  EnterTextBox.EnterCommandProperty := DependencyProperty.Register( ;
    "EnterCommand", TypeOf( ICommand ), TypeOf( EnterTextBox ), ;
    UIPropertyMetadata{ null, PropertyChangedCallback{ EnterCommandPropertyChanged } } )

  return          
	
static method EnterCommandPropertyChanged( d as DependencyObject, ;
    e as DependencyPropertyChangedEventArgs ) as void
  local oEnterTextBox as EnterTextBox
  local oCommand as ICommand
	
  oEnterTextBox := ( EnterTextBox ) d
  oCommand := ( ICommand ) e:NewValue
  oEnterTextBox:_EnterCommand := oCommand
	
  return

property _EnterCommand as ICommand
  set
    _oEnterCommand := value
    if _oEnterCommand == null
      self:KeyDown -= KeyDownEx
    else
      self:KeyDown += KeyDownEx
    endif
  end set
  get   
    return _oEnterCommand
  end get
end property  

method KeyDownEx( oSender as object, e as KeyEventArgs ) as void
	
  if e:Key:Equals( Key.Enter ) .and. _oEnterCommand != null ;
    .and. _oEnterCommand:CanExecute( oSender )
    _oEnterCommand:Execute( oSender )
  endif
	
  return

end class
and the assignment of the EnterCommand in the ViewModel is simple:

Code: Select all

self:EnterTextBoxCommand := RelayCommand{ TextBoxEnter }
Hope this helps someone!
Attachments
TextBoxEnterMVVM.zip
(5.22 KiB) Downloaded 68 times
Wolfgang Riedmann
Meran, South Tyrol, Italy
wolfgang@riedmann.it
https://www.riedmann.it - https://docs.xsharp.it
User avatar
Meinhard
Posts: 81
Joined: Thu Oct 01, 2015 4:51 pm

MVVM: how to build a control with databinding or enter key in a TextBox

Post by Meinhard »

Hi Wolfgang,

just curios. Wouldn't it be better to implement this as an attached property? Thta way you are not in the need to inherit from a control class and can attach they very same solution to different controls?

Regards
Meinhard
User avatar
wriedmann
Posts: 3755
Joined: Mon Nov 02, 2015 5:07 pm
Location: Italy

MVVM: how to build a control with databinding or enter key in a TextBox

Post by wriedmann »

Hi Meinhard,

yes, that would be another possibility. As often, there are more than only one way to a target....

I have written just a few (databound) controls for my DoorConfigurator, so this is only a stripped down sample to be easier to understand.
And I prefer just code to XAML, but that is a personal preference, because I think I have a better control over the behavior.

Wolfgang
Wolfgang Riedmann
Meran, South Tyrol, Italy
wolfgang@riedmann.it
https://www.riedmann.it - https://docs.xsharp.it
User avatar
Meinhard
Posts: 81
Joined: Thu Oct 01, 2015 4:51 pm

MVVM: how to build a control with databinding or enter key in a TextBox

Post by Meinhard »

> And I prefer just code to XAML,

I know :), but you should be able to use attached dependency properties from code as well.

Regards
Meinhard
User avatar
wriedmann
Posts: 3755
Joined: Mon Nov 02, 2015 5:07 pm
Location: Italy

MVVM: how to build a control with databinding or enter key in a TextBox

Post by wriedmann »

Hi Meinhard,

I'll research and post another sample when I have a bit of time - have only to finish something now (in X#).

Wolfgang
Wolfgang Riedmann
Meran, South Tyrol, Italy
wolfgang@riedmann.it
https://www.riedmann.it - https://docs.xsharp.it
Post Reply