Customizing Child Window In Silverlight

Xin chào các bạn hôm nay mình xin hướng dẩn cách tạo một ChildWindow trong Silverlight.

Đầu tiên các bạn tạo New một Silverlight Project và đặt tên là CustomChildWindow:

image

tiếp theo chúng ta làm một giao diện đơn giản, gồm có 1 Button đặt tên là btnClick để khi Click vào Button sẽ gọi ChildWindow :

image

tiếp theo là tạo sự kiện cho nút btnClick:

  • Chọn chọn sự kiện Click  trong XAML
  • Sau đó chọn New Event Handler

Sau Đây là Code XAML của giao diện:

   1: <UserControl x:Class="CustomChildWindow.MainPage"

   2:     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

   3:     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

   4:     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

   5:     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

   6:     mc:Ignorable="d"

   7:     d:DesignHeight="600" d:DesignWidth="800">

   8:

   9:     <Grid x:Name="LayoutRoot">

  10:         <Grid.RowDefinitions>

  11:             <RowDefinition Height="150"></RowDefinition>

  12:             <RowDefinition Height="60"></RowDefinition>

  13:             <RowDefinition Height="*"></RowDefinition>

  14:         </Grid.RowDefinitions>

  15:         <TextBlock FontSize="50" Grid.Row="0">Customizing Child Window</TextBlock>

  16:         <StackPanel Grid.Row="1">

  17:             <StackPanel.Background>

  18:                 <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

  19:                     <GradientStop Color="Black" Offset="0" />

  20:                     <GradientStop Color="#FF464646" Offset="1" />

  21:                     <GradientStop Color="#FFDCD4D4" Offset="0.484" />

  22:                 </LinearGradientBrush>

  23:             </StackPanel.Background>

  24:         </StackPanel>

  25:         <Button Grid.Row="2" FontSize="20" Click="" Margin="0,272,44,48" Width="150" Height="70" Name="btnClick" Content="Click Me!" HorizontalAlignment="Right"/>

  26:         <Grid.Background>

  27:             <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

  28:                 <GradientStop Color="#FF8383D4" Offset="0" />

  29:                 <GradientStop Color="White" Offset="1" />

  30:             </LinearGradientBrush>

  31:         </Grid.Background>

  32:     </Grid>

  33: </UserControl>

Tiếp theo là tạo ChildWindow :

  • các bạn Click chuột phải vào Silverlight Project chọn Add New Item :
  • Chọn ChildWindow và đặt tên cho nó là MyChildWindow

image

và bây giờ các bạn có thể dể dàng gọi ChildWindow này trong Code Behide (MainPage.xaml.cs):

   1: using System;

   2: using System.Collections.Generic;

   3: using System.Linq;

   4: using System.Net;

   5: using System.Windows;

   6: using System.Windows.Controls;

   7: using System.Windows.Documents;

   8: using System.Windows.Input;

   9: using System.Windows.Media;

  10: using System.Windows.Media.Animation;

  11: using System.Windows.Shapes;

  12:

  13: namespace CustomChildWindow

  14: {

  15:     public partial class MainPage : UserControl

  16:     {

  17:         public MainPage()

  18:         {

  19:             InitializeComponent();

  20:         }

  21:

  22:         private void btnClick_Click(object sender, RoutedEventArgs e)

  23:         {

  24:             MyChildWindow window = new MyChildWindow();

  25:             window.Show();

  26:         }

  27:     }

  28: }

bây giờ kết quả sau khi bạn Click là Childwindow sẽ hiện ra:

image

Ngoài ra các bạn có thể tùy chỉnh OverLay Backround với những màu khác và độ Trong suốt khác:

   1: private void btnClick_Click(object sender, RoutedEventArgs e)

   2:         {

   3:             MyChildWindow window = new MyChildWindow();

   4:             window.Show();

   5:             window.OverlayOpacity = 0.5;

   6:             window.OverlayBrush = new SolidColorBrush(Colors.Magenta);

   7:         }

Và Kết quả là Smile:

image

Leave a comment