【UWP开发】20-输入控件input controls

MainPage.xaml

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" Margin="10,10,0,0">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" MinHeight="0" />
            <RowDefinition Height="Auto" MinHeight="52.8" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>

        <TextBlock Text="CheckBox" VerticalAlignment="Center" Height="19" Margin="0,0,0.2,0" />
        <StackPanel Grid.Column="1"
                    Margin="19.8,10,0.4,10" 
                    Orientation="Horizontal">
            <CheckBox Name="MyCheckBox" 
                      Content="Agree?"
                      Tapped="MyCheckBox_Tapped" />
            <TextBlock Name="CheckBoxResultTextBlock" />
        </StackPanel>

        <TextBlock Grid.Row="2" 
                   Text="RadioButton"  
                   VerticalAlignment="Center" Height="19" Margin="0,0,0.2,0" />
        <StackPanel Grid.Row="2" 
                    Grid.Column="1" 
                    Orientation="Horizontal"
                    Margin="19.8,10,0.4,10">
            <RadioButton Name="YesRadioButton" 
                         Content="Yes" 
                         GroupName="MyGroup" 
                         Checked="RadioButton_Checked" />
            <RadioButton Name="NoRadioButton" 
                         Content="No" 
                         GroupName="MyGroup" 
                         Checked="RadioButton_Checked" />
            <TextBlock Name="RadioButtonTextBlock" />
        </StackPanel>

        <TextBlock Grid.Row="3" 
                   Text="ComboBox" 
                   Name="MyComboBox"  
                   VerticalAlignment="Center" Height="19" Margin="0,0,0.2,0" />
        <StackPanel Orientation="Horizontal" 
                    Grid.Row="3" 
                    Grid.Column="1" 
                    Margin="19.8,10,0.4,10">
            <ComboBox SelectionChanged="ComboBox_SelectionChanged" >
                <ComboBoxItem Content="Fourth" />
                <ComboBoxItem Content="Fifth" />
                <ComboBoxItem Content="Sixth" IsSelected="True" />
            </ComboBox>
            <TextBlock Name="ComboBoxResultTextBlock" />
        </StackPanel>

        <TextBlock Grid.Row="4" Text="ListBox" VerticalAlignment="Center" Height="19" Margin="0,0,0.2,0" />
        <StackPanel Grid.Row="4" Grid.Column="1"  Margin="19.8,10,0.4,10.4">
            <ListBox Name="MyListBox" 
                     SelectionMode="Multiple" 
                     SelectionChanged="ListBox_SelectionChanged">
                <ListBoxItem Content="First" />
                <ListBoxItem Content="Second" />
                <ListBoxItem Content="Third" />
            </ListBox>
            <TextBlock Name="ListBoxResultTextBlock" />
        </StackPanel>

        <TextBlock Grid.Row="5" Text="Image" VerticalAlignment="Center" Height="19" Margin="0,0,0.2,0" />
        <Image Source="Assets/logo.png" 
               HorizontalAlignment="Left"
               Width="250"
               Grid.Row="5" 
               Grid.Column="1" 
               Stretch="UniformToFill"
               Margin="19.8,10.6,0,9.6" />

        <TextBlock Grid.Row="7" Text="ToggleButton" VerticalAlignment="Center" Height="19" Margin="0,0,0.2,0"  />
        <StackPanel Orientation="Horizontal" 
                    Grid.Row="7" 
                    Grid.Column="1"  
                    Margin="19.8,10.4,0.4,9.4" >
            <ToggleButton Name="MyToggleButton" 
                          Content="Premium Option" 
                          IsThreeState="True" 
                          Click="MyToggleButton_Click" />
            <TextBlock Name="ToggleButtonResultTextBlock" />
        </StackPanel>

        <TextBlock Grid.Row="8" 
                   Text="ToggleSwitch" 
                   VerticalAlignment="Center" Height="19" Margin="0,0,0.2,0" />
        <StackPanel Grid.Row="8" 
                      Grid.Column="1"  
                      Margin="19.8,10.6,0.4,9.2" >
            <ToggleSwitch>
                <ToggleSwitch.OffContent>
                    <TextBlock Text="I'm off right now." />
                </ToggleSwitch.OffContent>
                <ToggleSwitch.OnContent>
                    <TextBlock Text="I'm on!" />
                </ToggleSwitch.OnContent>
            </ToggleSwitch>
        </StackPanel>



    </Grid>

MainPage.xaml.cs

 public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
        }

    private void MyCheckBox_Tapped(object sender, TappedRoutedEventArgs e)
    {
      CheckBoxResultTextBlock.Text = MyCheckBox.IsChecked.ToString();
    }

    private void RadioButton_Checked(object sender, RoutedEventArgs e)
    {
      RadioButtonTextBlock.Text = (bool)YesRadioButton.IsChecked ? "Yes" : "No";
    }

    private void ComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {
      if (ComboBoxResultTextBlock == null) return;

      var combo = (ComboBox)sender;
      var item = (ComboBoxItem)combo.SelectedItem;
      ComboBoxResultTextBlock.Text = item.Content.ToString();

    }

    private void ListBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {
      var selectedItems = MyListBox.Items.Cast<ListBoxItem>()
                            .Where(p => p.IsSelected)
                              .Select(t => t.Content.ToString())
                                .ToArray();

      ListBoxResultTextBlock.Text = string.Join(", ", selectedItems);

    }

    private void MyToggleButton_Click(object sender, RoutedEventArgs e)
    {
      ToggleButtonResultTextBlock.Text = MyToggleButton.IsChecked.ToString();
    }
  }

图片的填充格式

None:没有做任何拉伸处理

Fill:拉伸至框格大小

Uniform

UniformTofill:和None差不多，但如果设置行间距啥的有区别就会发小不同