UWP入门（二） -- 基础笔记

原文:UWP入门（二） -- 基础笔记

不错的UWP入门视频，1092417123，欢迎交流

UWP-04 - What i XMAL?

XAML - XML Syntax（语法） ,create instance of Classes that define the UI by setting properties（属性）.

UWP-05 - Understanding Type Converters

Type Converters - Convert literal（字面的） strings in XML into enumerations,instance of classes,etc

UWP-06 - Understanding Default Properties, Complex Properties and the Property Element Syntax

Default Property … Ex. setrs Content Property:Click Me(this property is Content)

Complex Properties - Break out a property into its own element syntax:

    <Button Name="ClickMeButton"
            HorizontalAlignment="Left"
            Content="Click Me"
            Margin="20,20,0,0"
            VerticalAlignment="Top"
            Click="ClickMeButton_Click"
            Width="200"
            Height="100"
            >
        <Button.Background>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="Black" Offset="0"/>
                <GradientStop Color="Red" Offset="1"/>
            </LinearGradientBrush>
        </Button.Background>
    </Button>

UWP-07 - Understanding XAML Schemas and Namespace Declarations

Schema stuff（语法约束，最上面那一块）,is part of XAML,the number is 6.

Schemas define rules for XAML,for UWP,for desinger support,etc.

Namespaces tell XML parser where to find the definition/rules for a given element in the XAML.

UWP-08 - XAML Layout with Grids

Layout controls don’t have a content property …

they hava a Children property of type UIElementCollection.

By embedding any control inside of a layout control,

you are implicitly calling the Add method of the Children collection property.

eg:Grid.Children.Add(MyButton);

<Grid Background="Black">
  <Grid.RowDefinitions>
    <RowDefinition Height="*" />//pertcentage，eg:android:layout_weight
    <RowDefinition Height="*" />
    <RowDefinition Height="*" />
  </Grid.RowDefinitions>
  <Grid.ColumnDefinitions>
    <ColumnDefinition Width="*" />
    <ColumnDefinition Width="*" />
    <ColumnDefinition Width="*" />
  </Grid.ColumnDefinitions>
</Grid>

Sizes expressed in terms of:

Explicit pixels - 100//use pixels

Auto - use the largest value of elements it contains to define the width / height

* (Star Sizing) - Utilize all the available space

1* - Of all available space, give me 1 “share”

2* - Of all available space, give me 2 “shares”

3* - Of all available space, give me 3 “shares”

6 total shares … 3* would be 50% of the available width / height.

Elements put themselves into rows and columns using attached property syntax:

…

…

  <Button Grid.Row="0" />
</Grid>

• When referencing Rows and Columns … 0-based.
• There’s always one default implicit cell: Row 0, Column 0
• If not specified, element will be in the default cell

UWP-09 - XAML Layout with StackPanel

<StackPanel>
  <TextBlock>Top</TextBlock>
  <TextBlock>Bottom</TextBlock>
</StackPanel>

• Vertical Orientation by default.
• Left-to-right flow by default when Horizontal orientation.
• Most layouts will combine multiple layout controls.
• Grid will overlap controls. StackPanel will stack them.