Maxime FRAPPAT

Hum …no thanks ! – Lordinaire

Category: UWP (Page 2 of 2)

[UWP] Data binding to method and from event

With the Windows 10 Anniversary update, XAML becomes smarter with some great features for the data binding. It is now possible to bind to a property or an event to a method very easily !

Here is a sample of different type of bindings (old and new) to compare the XAML synthax.

ViewModel

public class MainViewModel : INotifyPropertyChanged
{
    private string _firstName;
    public string FirstName
    {
        get { return _firstName; }
        set
        {
            _firstName = value;
            OnPropertyChanged();
        }
    }

    private string _lastName;
    public string LastName
    {
        get { return _lastName; }
        set
        {
            _lastName = value;
            OnPropertyChanged();
        }
    }

    public MainViewModel()
    {
        FirstName = "Maxime";
        LastName = "Frappat";
    }

    public string ToFullName(string firstName, string lastName)
    {
        return string.Concat(firstName, " ", lastName);
    }

    public void DeleteLastName()
    {
        LastName = string.Empty;
    }

    #region INotifyPropertyChanged

    public event PropertyChangedEventHandler PropertyChanged;

    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));  
    }

    #endregion
}

Helper class

public static class TextHelper
{
    public static string ToFullName(string firstName, string lastName)
    {
        return string.Concat(firstName, " ", lastName);
    }
}

View (Code-Behind)

public sealed partial class MainPage : Page
{
    public MainViewModel ViewModel { get; set; }

    public MainPage()
    {
        InitializeComponent();

        ViewModel = new MainViewModel();
        DataContext = ViewModel;
    }
}

View (XAML)

<!-- BINDING TO PROPERTIES -->
<StackPanel Orientation="Vertical">
    <TextBlock Text="BINDING TO PROPERTIES" Style="{StaticResource TitleStyle}"/>

    <TextBlock>
        <Run Text="{Binding FirstName}" />
        <Run Text="{Binding LastName}" />
    </TextBlock>
</StackPanel>

<!-- xBIND TO PROPERTIES -->
<StackPanel Orientation="Vertical">
    <TextBlock Text="xBIND TO PROPERTIES" Style="{StaticResource TitleStyle}" />

    <TextBlock>
        <Run Text="{x:Bind ViewModel.FirstName, Mode=OneWay}" />
        <Run Text="{x:Bind ViewModel.LastName, Mode=OneWay}" />
    </TextBlock>
</StackPanel>

<!-- xBIND TO INTERNAL METHODS -->
<StackPanel Orientation="Vertical">
    <TextBlock Text="xBIND TO INTERNAL METHODS" Style="{StaticResource TitleStyle}" />

    <TextBlock Text="{x:Bind ViewModel.ToFullName(ViewModel.FirstName, ViewModel.LastName), Mode=OneWay}" />
</StackPanel>

<!-- xBIND TO EXTERNAL METHODS -->
<StackPanel Orientation="Vertical">
    <TextBlock Text="xBIND TO EXTERNAL METHODS" Style="{StaticResource TitleStyle}" />

    <TextBlock Text="{x:Bind helper:TextHelper.ToFullName(ViewModel.FirstName, ViewModel.LastName), Mode=OneWay}" />
</StackPanel>

<!-- xBIND FROM EVENT -->
<StackPanel Orientation="Vertical">
    <TextBlock Text="xBIND FROM EVENT" Style="{StaticResource TitleStyle}" />

    <TextBlock Tapped="{x:Bind ViewModel.DeleteLastName}">
        <Run Text="{x:Bind ViewModel.FirstName, Mode=OneWay}" />
        <Run Text="{x:Bind ViewModel.LastName, Mode=OneWay}" />
    </TextBlock>
</StackPanel>

Result

Each bindings will display the same text.

anniverary_binding

Don’t forget to target the last SDK for your project.

So easy !

[UWP] Adaptative streaming protocols

If you have ever tried to play with HLS (HTTP Live Streaming) with Windows Phone 8, you probably used the Player Framework with a MediaStreamSource (like Windows Phone Streaming Media).

With the new Windows 10 APIs, all that stuff become useless ! The MediaElement control of Universal Windows Platform app can handle that natively :) HLS or DASH (Dynamic Adaptive Streaming over HTTP) it’s up to you and it is very easy to use :

MediaElement mediaElement = new MediaElement();

// The source is an uri like :
// http://mydomain.com/toto/playlist.m3u8
var result = await AdaptiveMediaSource.CreateFromUriAsync(source);
if (result.Status == AdaptiveMediaSourceCreationStatus.Success)
{
    var astream = result.MediaSource;
    mediaElement.SetMediaStreamSource(astream);
}

Have fun :D

Page 2 of 2

Powered by WordPress & Theme by Anders Norén

%d bloggers like this: