Xamarin Forms : Triggers {Programmatically}

Posted by

The official documentation for Xamarin Forms Triggers can be found here. The documentation is great, however, triggers are written in XAML which I am not so fond of. I prefer to write the UI codes programmatically. If you are like me please continue reading.

There are four types of trigger. I will walk through each of them programatically.

1. Property Trigger
Entry myEntry1 = new Entry
{
Placeholder = “Tap to focus…”,
PlaceholderColor = Color.White,
BackgroundColor = Color.FromHex(“#484848”),
TextColor = Color.White,
Margin = new Thickness(0, 0, 0, 20)
};

//PROPERTY TRIGGER
Trigger propertyTrigger = new Trigger(typeof(Entry));
propertyTrigger.Property = IsFocusedProperty;
propertyTrigger.Value = true;

Setter setter = new Setter();
setter.Property = BackgroundColorProperty;
setter.Value = Color.DimGray;

propertyTrigger.Setters.Add(setter);
myEntry1.Triggers.Add(propertyTrigger);
//END PROPERTY TRIGGER
2. Data Trigger
Entry myEntry2 = new Entry
{
Placeholder = “Enter something and delete…”,
PlaceholderColor = Color.White,
BackgroundColor = Color.FromHex(“#484848”),
TextColor = Color.White,
Margin = new Thickness(0, 0, 0, 10)
};

Button triggerButton = new Button
{
Text = “Data Trigger”,
TextColor = Color.White,
FontAttributes = FontAttributes.Bold,
FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Button)),
BackgroundColor = Color.FromHex(“#484848”),
Margin = new Thickness(0, 0, 0, 20)
};
triggerButton.Clicked += (sender, e) => { Console.WriteLine(“Data Trigger button clicked.”); };

//DATA TRIGGER
DataTrigger dataTrigger = new DataTrigger(typeof(Button));
Binding dataBinding = new Binding();
dataBinding.Source = myEntry2;
dataBinding.Path = “Text.Length”;
dataTrigger.Binding = dataBinding;
dataTrigger.Value = 0;

Setter dataSetter1 = new Setter();
dataSetter1.Property = IsEnabledProperty;
dataSetter1.Value = false;

Setter dataSetter2 = new Setter();
dataSetter2.Property = Button.TextProperty;
dataSetter2.Value = “Data Trigger Enforced.”;

dataTrigger.Setters.Add(dataSetter1);
dataTrigger.Setters.Add(dataSetter2);
triggerButton.Triggers.Add(dataTrigger);//if entry text > 0 enabled else disabled.
//END DATA TRIGGER
3. Event Trigger
Entry myEntry3 = new Entry
{
Placeholder = “Green = OK, Red = Error.”,
PlaceholderColor = Color.White,
BackgroundColor = Color.FromHex(“#484848”),
TextColor = Color.White,
Margin = new Thickness(0, 0, 0, 20)
};
//EVENT TRIGGER
EventTrigger entryEventTrigger = new EventTrigger();
entryEventTrigger.Event = “TextChanged”;
entryEventTrigger.Actions.Add(new NumericValidationTriggerAction());
myEntry3.Triggers.Add(entryEventTrigger);//entry TextChanged event .. checks entered valid double and changes entry color.
//END EVENT TRIGGER
4. Multi Trigger
Entry myEntry4 = new Entry
{
Placeholder = “Enter 2 characters…”,
PlaceholderColor = Color.White,
BackgroundColor = Color.FromHex(“#484848”),
TextColor = Color.White,
Margin = new Thickness(0, 0, 0, 10)
};

Entry myEntry5 = new Entry
{
Placeholder = “Enter 4 characters…”,
PlaceholderColor = Color.White,
BackgroundColor = Color.FromHex(“#484848”),
TextColor = Color.White,
Margin = new Thickness(0, 0, 0, 10)
};

Button multiTriggerButton = new Button
{
Text = “Multi Trigger”,
TextColor = Color.White,
FontAttributes = FontAttributes.Bold,
FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Button)),
BackgroundColor = Color.FromHex(“#484848”),
Margin = new Thickness(0, 0, 0, 10),
IsEnabled = false
};
multiTriggerButton.Clicked += (sender, e) => { Console.WriteLine(“Multi Trigger button clicked.”); };

//MULTI TRIGGER
MultiTrigger multiTrigger = new MultiTrigger(typeof(Button));
BindingCondition bindingCondition1 = new BindingCondition()
{
Binding = new Binding(“Text”) { Path = “Text.Length”, Source = myEntry4 },
Value = “2”
};

BindingCondition bindingCondition2 = new BindingCondition()
{
Binding = new Binding(“Text”) { Path = “Text.Length”, Source = myEntry5 },
Value = “4”
};

multiTrigger.Conditions.Add(bindingCondition1);
multiTrigger.Conditions.Add(bindingCondition2);

Setter multiSetter1 = new Setter();
multiSetter1.Property = IsEnabledProperty;
multiSetter1.Value = true;

Setter multiSetter2 = new Setter();
multiSetter2.Property = BackgroundColorProperty;
multiSetter2.Value = Color.Purple;

multiTrigger.Setters.Add(multiSetter1);
multiTrigger.Setters.Add(multiSetter2);
multiTriggerButton.Triggers.Add(multiTrigger);//button is enabled if both entry are of length =2 and =4 respectively.
//END MULTI TRIGGER

So, here you go, all the triggers implemented PROGRAMMATICALLY.

For full IMPLEMENTATION, please follow this link. Just copy paste and give it a GO.