Open Source - James Montemagno https://staging.montemagno.com/tag/open-source/ https://staging.montemagno.com/content/images/2017/08/MonogramIcon_Orange_NoBuffer.png Open Source - James Montemagno https://staging.montemagno.com/tag/open-source/ Hugo -- gohugo.io Tue, 13 Oct 2026 23:21:57 GMT 60 AsyncCommand & More Come to MVVM Helpers https://staging.montemagno.com/asynccommand-more-come-to-mvvmhelpers/ 5d59eb16385fe90038b6e744 Mon, 19 Aug 2019 19:30:00 GMT Having to write boilerplate code over and over again is not only annoying, but it is a time sink when trying to build apps. That is why nearly 4 years ago I created a small little open source library to get rid of MVVM boilerplate code that I called MVVM Helpers. It contains all sorts of goodies including an ObservableObject, BaseViewModel, ObservableRangeCollection, and all sorts of small utlilities. I use it in every app that I have ever built since its original release and it has been downloaded nearly 500,000 times.

What's Next for MVVM Helpers

The library has been moving along pretty nicely, with small enhancements here and there, but I never really planned for much more. Until Holly tweeted at me last week about using lambas in Commands:

This eventually lead me down a path of reading a great blog by John Thiriet on going async with async command. I immediately thought to my self.... Why isn't this in MVVM Helpers?!?!?!? So this weekend I sat down and combined a bunch of code from John, Xamarin.Forms, and Brandon Minnick's AsyncAwaitBestPractices library, and jammed it into MVVM Helpers.

So, I am pleased to introduce MVVM Helpers version 1.5.0 packed full of all sorts of new goodies for developers!

Enter AsyncCommand

Let's first look at Holly's tweet and the code you would normally write with the build in Xamarin.Forms Command.

public ICommand MyCommand { get; }
public MyViewModel()
{
    MyCommand = new Command(async () => await DoAsync());
}

async Task DoAsync()
{
   // do stuff async
}

The issues here is that the code is a bit gross and also handling exceptions is a bit tricky if something goes wrong. Now with AsyncCommand built into MVVM Helpers the code looks like this:

public ICommand MyCommand { get; }
public MyViewModel()
{
    MyCommand = new AsyncCommand(DoAsync);
}

async Task DoAsync()
{
   // do stuff async
}

The nice part here is that you are still creating an ICommand, which will work great with Xamarin.Forms.

The other thing that you can do is pass in a bunch of other parameters to handle exceptions and also if it can execute or not:

public ICommand MyCommand { get; }
public bool canExecute;
public MyViewModel()
{
    MyCommand = new AsyncCommand(DoAsync,
        (t) =>
        {
            return canExecute;
        },
        (ex) =>
        {
            // Handle exception here
        });
}

async Task DoAsync()
{
    // do stuff async
}

There is also AsyncCommand<T> that can be used if you need to pass in a parameter to the method:

public ICommand MyCommand { get; }
public MyViewModel()
{
    MyCommand = new AsyncCommand<string>(DoAsync);
}

async Task DoAsync(string parameter)
{
    // do stuff async
}

Command and WeakEventManager

Additionally, I decided that sometimes you may want to use a Command in your shared code and not have to bring in Xamarin.Forms. This is why I ripped the code directly out of Xamarin.Forms and put it into MVVM Helpers!

public ICommand MyCommand { get; }
public MyViewModel()
{
    MyCommand = new Command<string>(Do);
}

void Do(string parameter)
{
    // do stuff async
}

Finally, there is a new WeakEventManager also pulled out of Xamarin.Forms that handles raising of EventHandlers. The nice thing about using WeakEventManager is that it will allow for garbage collection when an event handler is still subscribed. I made it public so you can also use it if you are creating EventHandlers in your own project.

readonly WeakEventManager weakEventManager = new WeakEventManager();
public event EventHandler CanExecuteChanged
{
    add { weakEventManager.AddEventHandler(value); }
    remove { weakEventManager.RemoveEventHandler(value); }
}

Available Now

You can grab the library on NuGet right now and of course open an issue or send a PR on GitHub.

See it in action

It is fun to look back to when I first started The Xamarin Show and some of the early episodes I did, including one on MVVM Helpers:

]]>
The Beautiful & Complex FlexLayout Comes to Hanselman.Forms https://staging.montemagno.com/flexlayout-image/ 5c821c36b2f3d500bff4c965 Fri, 08 Mar 2019 18:22:00 GMT

Last week I wrote about my new quest to fully optimize and enhance Hanselman.Forms. This involves using the latest and greatest in Xamarin.Forms and Xamarin.Essentials, but it also means spicing up the app with some lovely visuals and design. My first quest was to re-design the podcast section of the mobile app to create a list in grid form of different podcast that Hanselman produces.

So, first things first we should design a card to hold each podcast in. This can be accomplished with a simple Frame with a drop shadow on it:

<Frame
    Padding="0"
    VerticalOptions="Start"
    HasShadow="True">
    <Grid Padding="0">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        <Image Source="{Binding Art}" Aspect="AspectFill"/>
        <Label Grid.Row="1" Margin="10,0" Text="{Binding Title}"/>
    </Grid>
</Frame>

This simple code results in a pretty nice look for album artwork:

Pod

I will absolutely want to try out the new Visual Frame/CardView enhancements now that Xamarin.Forms 3.6 is out to make sure it also looks great on iOS.

Wrapping Podcasts

Wrapping the multiple podcasts into columns and rows dymanically would be pretty ideal for something like a CollectionView, but it is still in preview. I thought instead that the the FlexLayout would be a great option because it can arrange its children horizontally and vertically in a stack in addition to wrapping items. Here is one of the samples from the documentation:

ExperimentAlignContent2-Large

Taking this concept I was able to combine the FlexLayout with a BindableLayout to make something pretty spectacular:

 <ScrollView>
    <FlexLayout BindableLayout.ItemsSource="{Binding Podcasts}"
           Wrap="Wrap"
           Direction="Row"
           JustifyContent="Start"
           AlignItems="Start"
           AlignContent="Start"
           Padding="8">
        <BindableLayout.ItemTemplate>
            <DataTemplate>
                <Grid Margin="4,4,4,4"
                      FlexLayout.Basis="{OnIdiom Phone='50%', Tablet='33%'}"
                      FlexLayout.AlignSelf="Start">

                   <local:PodcastCardView />

                </Grid>
            </DataTemplate>
        </BindableLayout.ItemTemplate>
    </FlexLayout>
</ScrollView>

It tooke me a long time how to figure out how to space each of the cards correctly and wrap to the next line while still starting on the left hand side. This was accomplished by setting all of the Align properties to Start as well as the JustifyContent. It resulted in a really great Android version:

53674791-420bf280-3c45-11e9-9438-eb608208ce7d

Better yet, when I ran it on UWP or changed the orientation the FlexLayout reacted very nicely:

ezgif.com-resize-1

Seeing this in action I was very content and wrapped up a great week 2 of live streaming updating the app on Twitch.

You can check out the full pull request on GitHub to see how I setup a full mock data source, handled tab transitions, and the final implementation for FlexLayout in the app. Don't forget that I am accepting pull requests and feature requests too on the official GitHub page.

My final take away thoughts are that while the FlexLayout is relatively complicated and has tons of little settings to tweak, it is still extremely powerful and worth dedicating some time to.

]]>
Xamarin Evolve + Open Source Save The Date App https://staging.montemagno.com/xamarin-evolve-open-source-save-the-date-app/ 598df8f2c121b60019bf3000 Mon, 24 Aug 2015 17:51:15 GMT In just under eight months in Orlando, FL thousands of mobile .NET developers will be heading to the next Xamarin Evolve conference. Xamarin Evolve 2014 was one of the most spectacular conferences that I have ever been part of and have ever attended. The most amazing developers came together for five action packed days of training, sessions, hacking, and collaboration. To keep it short, you do NOT want to miss Xamarin Evolve 2016.

I had the joy last year of crafting multiple mobile applications for Evolve including the main conference application and an interactive scavenger hunt based on iBeacons called Evolve Quest.

With Evolve 2014 coming to a close there isn’t much need for the mobile application to hang around on the app stores, which is why I teamed up with Xamarin’s very own Mike James to craft an updated Save the Date application for Evolve. We decided that we wanted something simple but native. It had to be elegant with the latest iOS and Android designed, but still have deep integration into the platforms. The new Save the Date application for Evolve can be installed from both the Apple App Store or Google Play for Android enabling you easily sign up for updates, add Evolve to your calendar, and of course share Evolve with your friends.

Best yet, is that you can see exactly how Mike and I created the application and create your own Save the Date application for your upcoming event. Simply head over to the github repo to download the entire source code and get started today.

]]>