I am rewriting the Cashflow calculator app that I made last fall from Java to a Xamarin Forms app. If I ever decide to release to iOS this will make it much easier.
One of the workhorses for this app is the Entry form element. This is your standard input field from the keyboard.
There are two features that I want to talk about today. Setting the keyboard type and Completed and TextChanged events.
Setting the Keyboard
The Entry element lets you specify the keyboard type like you would expect. There is the Default – the standard keyboard on your device, Numeric – number only entry for things like calculators and money (the one I am using the most), also Telephone, Url, Email, and Chat.
If you have done any sort of UI programming before, you know that limiting the characters that your user can put in significantly reduces the number of potential errors.
XAML Example:
<Entry Keyboard="Numeric" />
The Completed Event
Whenever the user finishes filling out the field and hits the enter or next key, the Completed event gets fired. You can hook up your Entry field to call a function whenever this happens.
For me whenever the user changes one of the values in my form, I recalculate the cashflow value of the property they are putting in. This way they get instant feedback on what one value has to the overall calculation.
XAML Example:
<Entry Completed="CalculateCashflow" />
Where CalculateCashflow is a function in the XAML’s code behind file.
TextChanged Event
This allows you to call a function as soon as the text in a field gets changed, not just when you are done changing it. It might seem like an odd thing to have since we already have a Completed event, but I will give you an instance I plan on using it for.
A couple of my form fields will be connected and be different representations of the same value. For instance, when estimating cashflow of a property it is common to estimate the repair and vacancy costs as percents of the rent.
In this case I will have a pair of split fields that are related. A repair_cash Entry and a repair_percent Entry. Whenever one of them changes, I want the other one to be updated.
XAML Example:
<Entry x:Name="repair_cash" TextChanged="SetRepairPercent" />
<Entry x:Name="repair_percent" TextChanged="SetRepairCash" />
Where SetRepairPercent and SetRepairCash are functions in the XAML’s code behind file.
Note that the Completed event callback function takes a sender object and an EventArgs object while the TextChanged event callback function takes a sender object and a TextChangedEventArgs object.
Really enjoying Xamarin so far. Looking forward to releasing a couple apps with it this year.