I.Introduction
ProgressBar là Control hiển thị tiến độ của một tiến trình, thường được sử dụng rất nhiều trong các ứng dụng.
Trong bài này mình xin chia sẻ về cách sử dụng progressbar control trong Silverlight.
II Creating Project And Coding
Mở Visual Studio 2010 lên và tạo Silverlight Application.
Tiếp theo chúng ta tạo một giao diện gồm có 1 Progressbar, một label để hiển thị tiến trình đã chạy bao nhiêu, và một Button để khi Click vào thì tiến trình tạm ừng, và khi Click lần nữa thì chạy tiếp.
Các bạn có thể kéo thả Control từ ToolBox vào giao diện , hoặc xử lý trực tiếp trên code XAML:
1: <UserControl x:Class="ProcessBar.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="300" d:DesignWidth="400"
8: xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk">
9:
10: <Grid x:Name="LayoutRoot" VerticalAlignment="Center" HorizontalAlignment="Center" Height="298">
11: <Grid.Background>
12: <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
13: <GradientStop Color="Black" Offset="0" />
14: <GradientStop Color="White" Offset="1" />
15: </LinearGradientBrush>
16: </Grid.Background>
17: <Grid.RowDefinitions>
18: <RowDefinition Height="30*" />
19: <RowDefinition Height="243*" />
20: </Grid.RowDefinitions>
21: <ProgressBar Height="28" Maximum="500" HorizontalAlignment="Center" Margin="12,134,12,0" Name="progressBar" VerticalAlignment="Top" Width="376" Value="0" Grid.Row="1" />
22: <sdk:Label Grid.Row="1" Height="43" Content="" HorizontalAlignment="Center" Margin="127,85,145,0" Name="lblresuilt" VerticalAlignment="Top" Width="128" FontSize="18">
23: <sdk:Label.Foreground>
24: <LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
25: <GradientStop Color="Red" Offset="0" />
26: <GradientStop Color="#FF390069" Offset="1" />
27: <GradientStop Color="#FF49BE5E" Offset="0.517" />
28: <GradientStop Color="White" Offset="0.448" />
29: </LinearGradientBrush>
30: </sdk:Label.Foreground>
31: </sdk:Label>
32: <Button Grid.Row="0" Content="Click" Click="Button_Click"></Button>
33: </Grid>
34: </UserControl>
// Sự Kiện Click cho Button “Click=Button_Click”
<Button Grid.Row="0" Content="Click" Click="Button_Click"></Button>
Các bạn Lưu ý là phải đạt giá trị ban đầu cho progressBar , trong bài này mình đặt là Value=”0”, Maximum=”500”
tiếp theo chúng ta xử lý sự kiện trong File 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: using System.Windows.Threading;
13:
14: namespace ProcessBar
15: {
16: public partial class MainPage : UserControl
17: {
18: DispatcherTimer timer;
19: bool flag = true;
20: int count = 0;
21: public MainPage()
22: {
23: InitializeComponent();
24: timer = new DispatcherTimer();
25: timer.Tick += new EventHandler(timer_Tick);
26: timer.Start();
27: }
28: void timer_Tick(object sender, EventArgs e)
29: {
30: if (flag)
31: {
32: if (progressBar.Value < progressBar.Maximum)
33: {
34: progressBar.Value++;
35: lblresuilt.Content = progressBar.Value*2 / 10 + "%";
36: }
37: else flag = false;
38: }
39: else
40: if (progressBar.Value > 0)
41: {
42: progressBar.Value--;
43: lblresuilt.Content = progressBar.Value * 2 / 10 + "%";
44: }
45: else flag = true;
46:
47: }
48: private void Button_Click(object sender, RoutedEventArgs e)
49: {
50: count++;
51: if (count%2 != 0)
52: {
53: timer.Stop();
54: }
55: else
56: timer.Start();
57: }
58: }
59: }
Ở đoạn Code trên chúng ta dùng Lớp DispatcherTimer để thực hiện việc đếm thời giàn, để sử dụng lớp này chúng ta phải khai báo using System.Windows.Threading;
Run Application(Ctrl + F5) And Look at the Resuilt:
/*Web is beautiful*/