I.Introdution
Tooltip có lẽ là một cái tên khá quen thuộc với các bạn, trong bài này mình xin chia sẻ cách sử dụng Tooltip trong Silverlight
II.Creatine Project And Coding
Mở Visual Studio lên và tạo mới Silverlight Application
Tiếp theo chúng ta làm một giao diện đơn giản
Để thêm một Tooltip cho một Control nào đó chúng ta khai báo thuộc tính ToolTipService.ToolTip="You are the best" trong code XAML của Control đó, các bạn có thể hiểu rõ hơn ở đoạn XAML sau :
1: <Button Height="60" Name="btn_Click" Content="Click Me"
2: ToolTipService.ToolTip="You are the best" FontSize="20"></Button>
và kết quả sau khi chạy thử ứng dụng :
Ngoài ra chúng ta cũng có thể tủy chỉnh các Control khác trong Tooltip, tiếp theo mình sẽ hướng dẩn các bạn thêm các Control như TextBock, Image vào ứng dụng :
1: <ToolTipService.ToolTip>
2: <ToolTip Background="Red">
3: <StackPanel>
4: <TextBlock Text="Silverlight Tootip"/>
5: <Image Source="/TooltipColtrol;component/Images/silverlight.jpg" />
6: <TextBlock Text="Web is beautiful"/>
7: </StackPanel>
8: </ToolTip>
9: </ToolTipService.ToolTip>
Các bạn lưu ý rằng Tooltip chỉ chứa 1 và chỉ 1 Control trong nó, do đó nếu muốn có nhiều Control trong nó thì các bản chỉ còn cách là chèn các Control đó vào một Layout Control, như đoạn Code trên là mình chèn các TextBlock,Image vào Stackpanel.
Chạy Úng dụng chúng ta có kết quả :
Khi Mouse Enter vào Stackpanel thì Tooltip hiện ra
Full Source code :
1: <UserControl x:Class="TooltipColtrol.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:
9: <Grid x:Name="LayoutRoot" Background="White" Margin="1" >
10: <StackPanel>
11: <StackPanel.Background>
12: <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
13: <GradientStop Color="#FF8ACCD8" Offset="0.023" />
14: <GradientStop Color="White" Offset="1" />
15: </LinearGradientBrush>
16: </StackPanel.Background>
17: <Button Height="60" Name="btn_Click" Content="Click Me"
18: ToolTipService.ToolTip="You are the best" FontSize="20"></Button>
19: <ToolTipService.ToolTip>
20: <ToolTip Background="Red">
21: <StackPanel>
22: <TextBlock Text="Silverlight Tootip"/>
23: <Image Source="/TooltipColtrol;component/Images/silverlight.jpg" />
24: <TextBlock Text="Web is beautiful"/>
25: </StackPanel>
26: </ToolTip>
27: </ToolTipService.ToolTip>
28: </StackPanel>
29: </Grid>
30: </UserControl>
/*Web is beautiful*/