UWP Coverting Text into Vector Image Using Microsoft Expression Blend

Open your Expression Blend and Drag a Textblock onto designer. Write some text and Increase its font as shown in picture.

Right click on your text and click on “ Convert to Path “ inside of Path . see the picture below.

Your image has been converted to a vector image. In order to see your path image select pen tool from toolbox as show below.

you can change the layout of your text by selecting Direct selection tool from toolbox. See the word “D” in below picture , by selecting any of its node using direct selection tool you can change its layout.

UWP Layout Controls and Usefull features of Grid Control

In this lesson I'm going to talking about layout rather the process of positioning visual
controls in other elements in your application user interface.

Important thing about all controls in XAML is their "Content Property".

"Content property can only be set to an instance of another object". And it can be set only once but that’s not the case with layout controls.But Content Property of layout controls can be set more than once. In fact they don’t have a content property instead they have a "Children Property". Like Grid Control.

Children Property is a special data type (a collection data type) that can hold XAML
controls called UI element collection.
                In XAML as we add new instances of controls inside of the definition of our layout
control, we actually calling the add method of our layout controls. So here you can
understand that how XAML is simplifying stuff for us.

·        

Grid Control

·         Grid allows you to create rows and columns to make cells and then each of the
controls that are used by our application can request which row and which column
they wanna be placed inside of.

·         Whenever you create a new project , that project already contain a Grid with no rows
and columns defined . By default there is always 1 row and 1 column in Grid even if it is
not explicitly defined.

·         Grid.Row="0" how this works ? This is actually called attached properties.
so the point is why attached properties are exists ? This is an advance XAML topic to
discuss.

·         Attached Properties:

Look at this [Grid.Row="1"] , Grid.Row is attached property here.
attached property is just like a global property that can be accessed from anywhere in
given scope.

·         Attached Properties VS Dependency Properties :
attached properties keep your XAML simple.

·         Sizing rows and Columns

o    Height="Auto"
height="auto" mean the height for the row should be tall enough to accommodate all of the
contents inside it.

o    Height="*" ( Star Sizing )
Utilize the all available space.
when you write like Height= " 3 * " > its mean you're saying give me 3 shares from all the available space.

o    When you write height and width in numbers like Width ="100" it represents that number of pixels for the width and height.

o    In general its not a good idea to put sizing properties in numbers of pixels because there are
various screen sizes upon which your application will run.

o    When you do not specify a row or column for a control it will go to row=0 and column=0
by default.

·         VerticalAlignment and HorizontalAlignment
vertical and horizontal alignments pull controls towards their boundaries. 

·         Margin Attribute:
margin attributes push controls away from their boundaries.
margin works in a clock wise fashion. Like margin=" left , top , right , bottom "

Understanding XAML schemas and namespace declarations

XAML is actually a flavor of XML , so in order to work with XAML , we need to follow its schema. Schema is like a agreement between both producer and consumer of XML , so they can work together. In case if you want to read that schema.
Whenever you create a new UWP Application in visual studio. You find some namespaces in the designer code of XAML. UWP stands for Universal Windows Platform. Go to solution explorer and Open MainPage.xaml. You'll find following lines of code in the tag of <page----></page> of your application. These are different schema and namespaces that uses in UWP applications. Now we're going to explore these namespaces one by one.


In the very first line you can find your class name which is infect your application name with MainPage. Below it you'll find few name spaces like 

• :x
• :local
• :d
• :mc

These are the namespaces that uses for different purposes. let explain each one by one. and one more thing before starting that URL which you're watching here are not URLs infect. They are URI which stands for Uniform Resource Indicator. URI used to define namespace that we can use further in our document of app. 

1. xmlns = " http:/schemas.microsoft.com/winfx/2006/xaml/presentation "
   This schema defines all UI ( User Interface ) components like button , textblock etc.
   
2. xmlns : x = " http://schemas.microsoft.com/winfx/2006/xaml "
   All of the rules of XAML in general are defined at this schema. From rules you can assume that rules which have to be followed while writing UI in XAML.
   
3. xmlns : local = " using: --- name of application --- "
   This is a local namespace . You can reference your own local classes here by using this namespace in application.
   
4. xmlns : d = "http://schemas.microsoft.com/expression/blend/2008 "
5. xmlns : mc = " http://schemas.openxmlformats.org/markup-compatibility/2006 "
   xmlns : d and xmlns : mc are the schemas that used to represent the design view of application. Design view is the designer area of application.
   
6. mc : Ignorable = " d "
   if you want to ignore some namespace on runtime , can put that namespace in double quotes as here " d " will be ignored on runtime that has been defined already on 4th line. This option exists here because of xmlns : mc namespace.  

This is all . It is my first ever attempt to write an article . Sorry for poor English . English is not being my mother tongue. Please provide feedback so that I'll improve my writing and be able to share further better stuff.