Tips And Tricks: Microsoft Blend For Visual Studio

Microsoft Blend for Visual Studio (formerly Microsoft Expression Blend) is a user interface design tool for XAML based application i.e. UWP, WPF or Silverlight.

Hint: This article is intended for beginners who are familiar with interface and basic operations of Blend for Visual Studio and looking to explore more about it.

Keeping on my trend, I'll simply discuss some easy steps to do basic data binding. We'll bind property of one element to property of another element. Those who aren't familiar with the concept of Data Binding can see this article.

After creating a new project i.e. Blank App (Universal Windows), follow these steps:

  1. Type textblock in Search Assets bar, textblock will appear right below it. Drag and drop it on your designer (MainPage.xaml). Similarly, also put a slider on your designer.

    assests

    After completing the 1st step, it should look something as in the following image:

    image

    Now start some binding stuff. We'll bind text property of textblock to slider's value property. It means, text written in textblock will be same as the value of slider. In a real world scenario, you can use this for displaying volume in your apps or games. Makes sense? Great! Scroll down and complete remaining steps.

  2. Click on your textblock and look for text property in properties panel on the right side. You'll see a box right in front of it, click and select create data binding.

    create data binding

  3. After clicking on create data binding, a new window will open up. You just need to do 3 things in that. Select ElementName under Binding type, slider under Element name and Value: (Double) under path. Click OK.

    slider

  4. You can run your application and see the text changing according to the value of slider.

    application

Conclusion

Data Binding is one of the key concepts in windows apps. You can try out this trick with some other properties too. Microsoft Blend have made it quite easier. If you've got any suggestion or question, don't hesitate to comment below. Cheers!

Originally published on TechNet Wiki.