How to perform SetBinding and BindingContext in a XAML page?

Question

I'm currently trying to develop an application based on a Xamarin Forms Tabbed Page. At first, the application had only one Content Page writen in C#. What I want to do now is to implement this existing Content Page into one of the tabs of the Tabbed Page.

I'm writing the Tabbed Page in XAML, and I don't know how to perform the "SetBinding" or "BindingContext" in this language.

Here's what I want to traduce from C# to XAML:

    public MyPage()
    {

        this.BindingContext = new MyPageViewModel();

        Picker pickerBluetoothDevices = new Picker() { Title = "Select a bth device" };
        pickerBluetoothDevices.SetBinding(Picker.ItemsSourceProperty, "ListOfDevices");
        pickerBluetoothDevices.SetBinding(Picker.SelectedItemProperty, "SelectedBthDevice");
        pickerBluetoothDevices.SetBinding(VisualElement.IsEnabledProperty, "IsPickerEnabled");

        Entry entrySleepTime = new Entry() {Keyboard = Keyboard.Numeric, Placeholder = "Sleep time" };
        entrySleepTime.SetBinding(Entry.TextProperty, "SleepTime");

        Button buttonConnect = new Button() { Text = "Connect" };
        buttonConnect.SetBinding(Button.CommandProperty, "ConnectCommand");
        buttonConnect.SetBinding(VisualElement.IsEnabledProperty, "IsConnectEnabled");

        Button buttonDisconnect = new Button() { Text = "Disconnect" };
        buttonDisconnect.SetBinding(Button.CommandProperty, "DisconnectCommand");
        buttonDisconnect.SetBinding(VisualElement.IsEnabledProperty, "IsDisconnectEnabled");

        Button buttonSend = new Button() { Text = "Send" };
        buttonSend.SetBinding(Button.CommandProperty, "SendCommand");
        buttonSend.SetBinding(VisualElement.IsEnabledProperty, "IsSendEnabled");

        StackLayout slButtons = new StackLayout() {Orientation = StackOrientation.Horizontal, Children = {buttonDisconnect, buttonConnect, buttonSend } };

        ListView lv = new ListView();
        lv.SetBinding(ListView.ItemsSourceProperty, "ListOfBarcodes");
        lv.ItemTemplate = new DataTemplate(typeof(TextCell));
        lv.ItemTemplate.SetBinding(TextCell.TextProperty, ".");

        int topPadding = 0;
        if (Device.RuntimePlatform == Device.iOS)
            topPadding = 20;

        StackLayout sl = new StackLayout { Children = { pickerBluetoothDevices, entrySleepTime, slButtons, lv }, Padding = new Thickness(0,topPadding,0,0) };
        Content = sl;
    }

What would be the equivalent of this C# code in XAML?

I started with something like this:

<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="TestBth.MyTabbedPage">
  <!--Pages can be added as references or inline-->
  <ContentPage Title="Connect">



        <ContentPage.Content>
            <StackLayout VerticalOptions="Center" HorizontalOptions="Center">

                <Picker x:Name="pickerBluetoothDevices" Title="Select a bth device"/>

                <Button x:Name="buttonConnect" Text="Connect"/>
                <Button x:Name="buttonDisconnect" Text="Disconnect"/>
                <Button x:Name="buttonSend" Text="Send"/>

                <ListView x:Name="lv"/>

            </StackLayout>

        </ContentPage.Content>

  </ContentPage>

Answer 1

You are going correct just change the c# binding property to Xaml property.

Like for ItemSourceProperty in c# the xaml binding is ItemSource

<StackLayout VerticalOptions="Center" HorizontalOptions="Center">

            <Picker x:Name="pickerBluetoothDevices" ItemsSource="{Binding ListOfDevices}" Title="Select a bth device" SelectedItem="{Binding SelectedBthDevice}" IsEnable="{Binding IsPickerEnabled}"/>

            <Button x:Name="buttonConnect" Text="Connect" Command="{Binding ConnectCommand}"/>
            <Button x:Name="buttonDisconnect" Text="Disconnect" Command="{Binding DisconnectCommand}"/>
            <Button x:Name="buttonSend" Text="Send" Command="{Binding SendCommand}"/>

            <ListView x:Name="lv" ItemSource="{Binding ListOfBarcodes}"/>

        </StackLayout>

Answer 2

any reason why you want to create bindings in code? You can also do bindings in code, for example to bind a command to a button, you use:

<Button Command="{Binding ButtonCommand}"/>

in the constructor of your view you need to set the context:

 public View()
  {
        InitializeComponent();
        this.BindingContext = this; // or instance of your ViewModel
  }

and also you need to have your command defined inside the BindingContext instance:

public ICommand ButtonCommand { get; set; }