通过对红绿蓝三个Slider控件的赋值来综合起来三种颜色调试出来大面板的颜色。

xaml

1. <!--LayoutRoot contains the root grid where all other page content is placed--> 
2.     <Grid x:Name="LayoutRoot" Background="Transparent"> 
3.         <Grid.RowDefinitions> 
4.             <RowDefinition Height="Auto"/> 
5.             <RowDefinition Height="*"/> 
6.         </Grid.RowDefinitions> 
7.  
8.         <!--TitlePanel contains the name of the application and page title--> 
9.         <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28"> 
10.             <TextBlock x:Name="ApplicationTitle" Text="COLOR SCROLL" Style="{StaticResource PhoneTextNormalStyle}"/> 
11.         </StackPanel> 
12.  
13.         <!--ContentPanel - place additional content here--> 
14.         <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> 
15.             <Grid.RowDefinitions> 
16.                 <RowDefinition Height="*" /> 
17.                 <RowDefinition Height="*" /> 
18.             </Grid.RowDefinitions> 
19.               
20.             <Rectangle Name="rect" 
21.                        Grid.Row="0" 
22.                        Grid.Column="0" /> 
23.               
24.             <Grid Name="controlGrid" 
25.                   Grid.Row="1" 
26.                   Grid.Column="0"> 
27.                 <Grid.RowDefinitions> 
28.                     <RowDefinition Height="Auto" /> 
29.                     <RowDefinition Height="*" /> 
30.                     <RowDefinition Height="Auto" /> 
31.                 </Grid.RowDefinitions> 
32.                   
33.                 <Grid.ColumnDefinitions> 
34.                     <ColumnDefinition Width="*" /> 
35.                     <ColumnDefinition Width="*" /> 
36.                     <ColumnDefinition Width="*" /> 
37.                 </Grid.ColumnDefinitions> 
38.                   
39.                 <!-- Red column --> 
40.                 <TextBlock Grid.Column="0" 
41.                            Grid.Row="0" 
42.                            Text="Red" 
43.                            Foreground="Red" 
44.                            Style="{StaticResource textStyle}" /> 
45.                   
46.                 <Slider Name="redSlider" 
47.                         Grid.Column="0" 
48.                         Grid.Row="1" 
49.                         Foreground="Red" 
50.                         Style="{StaticResource sliderStyle}" 
51.                         ValueChanged="OnSliderValueChanged" /> 
52.                   
53.                 <TextBlock Name="redText" 
54.                            Grid.Column="0"   
55.                            Grid.Row="2" 
56.                            Text="0" 
57.                            Foreground="Red" 
58.                            Style="{StaticResource textStyle}" /> 
59.                   
60.                 <!-- Green column --> 
61.                 <TextBlock Grid.Column="1" 
62.                            Grid.Row="0" 
63.                            Text="Green" 
64.                            Foreground="Green" 
65.                            Style="{StaticResource textStyle}" /> 
66.  
67.                 <Slider Name="greenSlider" 
68.                         Grid.Column="1" 
69.                         Grid.Row="1" 
70.                         Foreground="Green" 
71.                         Style="{StaticResource sliderStyle}" 
72.                         ValueChanged="OnSliderValueChanged" /> 
73.  
74.                 <TextBlock Name="greenText" 
75.                            Grid.Column="1"   
76.                            Grid.Row="2" 
77.                            Text="0" 
78.                            Foreground="Green" 
79.                            Style="{StaticResource textStyle}" /> 
80.  
81.                 <!-- Blue column --> 
82.                 <TextBlock Grid.Column="2" 
83.                            Grid.Row="0" 
84.                            Text="Blue" 
85.                            Foreground="Blue" 
86.                            Style="{StaticResource textStyle}" /> 
87.  
88.                 <Slider Name="blueSlider" 
89.                         Grid.Column="2" 
90.                         Grid.Row="1" 
91.                         Foreground="Blue" 
92.                         Style="{StaticResource sliderStyle}" 
93.                         ValueChanged="OnSliderValueChanged" /> 
94.  
95.                 <TextBlock Name="blueText" 
96.                            Grid.Column="2"   
97.                            Grid.Row="2" 
98.                            Text="0" 
99.                            Foreground="Blue" 
100.                            Style="{StaticResource textStyle}" /> 
101.             </Grid> 
102.         </Grid> 
103.     </Grid> 

cs

1. using System;  
2. using System.Windows;  
3. using System.Windows.Controls;  
4. using System.Windows.Media;  
5. using Microsoft.Phone.Controls;  
6.  
7. namespace ColorScroll  
8. {  
9.     public partial class MainPage : PhoneApplicationPage  
10.     {  
11.         public MainPage()  
12.         {  
13.             InitializeComponent();  
14.  
15.             //三个slider控件的初始值  
16.             redSlider.Value = 128;  
17.             greenSlider.Value = 128;  
18.             blueSlider.Value = 128;  
19.         }  
20.  
21.         //slider控件变化时触发的事件  
22.         void OnSliderValueChanged(object sender, RoutedPropertyChangedEventArgs<double> args)  
23.         {  
24.             Color clr = Color.FromArgb(255, (byte)redSlider.Value,  
25.                                             (byte)greenSlider.Value,  
26.                                             (byte)blueSlider.Value);//获取调剂的颜色  
27.  
28.             rect.Fill = new SolidColorBrush(clr);//用该颜色的笔刷填充大面板  
29.  
30.             redText.Text = clr.R.ToString("X2");  
31.             greenText.Text = clr.G.ToString("X2");  
32.             blueText.Text = clr.B.ToString("X2");  
33.         }  
34.  
35.         //手机方向变化触发的事件，从新布局  
36.         protected override void OnOrientationChanged(OrientationChangedEventArgs args)  
37.         {  
38.             ContentPanel.RowDefinitions.Clear();  
39.             ContentPanel.ColumnDefinitions.Clear();  
40.  
41.             // Landscape  
42.             if ((args.Orientation & PageOrientation.Landscape) != 0)  
43.             {  
44.                 ColumnDefinition coldef = new ColumnDefinition();  
45.                 coldef.Width = new GridLength(1, GridUnitType.Star);  
46.                 ContentPanel.ColumnDefinitions.Add(coldef);  
47.  
48.                 coldef = new ColumnDefinition();  
49.                 coldef.Width = new GridLength(1, GridUnitType.Star);  
50.                 ContentPanel.ColumnDefinitions.Add(coldef);  
51.  
52.                 Grid.SetRow(controlGrid, 0);  
53.                 Grid.SetColumn(controlGrid, 1);  
54.             }  
55.             // Portrait  
56.             else  
57.             {  
58.                 RowDefinition rowdef = new RowDefinition();  
59.                 rowdef.Height = new GridLength(1, GridUnitType.Star);  
60.                 ContentPanel.RowDefinitions.Add(rowdef);  
61.  
62.                 rowdef = new RowDefinition();  
63.                 rowdef.Height = new GridLength(1, GridUnitType.Star);  
64.                 ContentPanel.RowDefinitions.Add(rowdef);  
65.  
66.                 Grid.SetRow(controlGrid, 1);  
67.                 Grid.SetColumn(controlGrid, 0);  
68.             }  
69.             base.OnOrientationChanged(args);  
70.         }  
71.     }  
72. } 

本文转自linzheng 51CTO博客，原文链接:http://blog.51cto.com/linzheng/1079155