WP8滑动条(Slider)控件的使用

1. 

<Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <!--TitlePanel 包含应用程序的名称和页标题-->
        <StackPanel Grid.Row="0" Margin="12,17,0,28">
            <TextBlock Text="我的应用程序" Style="{StaticResource PhoneTextNormalStyle}"/>
            <TextBlock Text="Slider" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
        </StackPanel>

        <!--ContentPanel - 在此处放置其他内容-->
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <TextBlock HorizontalAlignment="Left" Height="42" Margin="26,14,0,0" TextWrapping="Wrap" Text="红色" VerticalAlignment="Top" Width="105"/>
            <TextBlock HorizontalAlignment="Left" Height="42" Margin="193,14,0,0" TextWrapping="Wrap" Text="绿色" VerticalAlignment="Top" Width="105"/>
            <TextBlock HorizontalAlignment="Left" Height="42" Margin="341,14,0,0" TextWrapping="Wrap" Text="蓝色" VerticalAlignment="Top" Width="105"/>
            <Slider x:Name="RedSilder" HorizontalAlignment="Left" Height="82" Margin="10,72,0,0" VerticalAlignment="Top" Width="142" Maximum="255"/>
            <Slider x:Name="GreenSlider" HorizontalAlignment="Left" Height="82" Margin="152,72,0,0" VerticalAlignment="Top" Width="142" Maximum="255"/>
            <Slider x:Name="BlueSlider" HorizontalAlignment="Left" Height="82" Margin="294,72,0,0" VerticalAlignment="Top" Width="142" Maximum="255"/>
            <TextBlock x:Name="RedText" HorizontalAlignment="Left" Height="41" Margin="26,159,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="105"/>
            <TextBlock x:Name="GreenText" HorizontalAlignment="Left" Height="41" Margin="167,159,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="105"/>
            <TextBlock x:Name="BlueText" HorizontalAlignment="Left" Height="41" Margin="312,159,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="105"/>
            <Ellipse x:Name="ColorEll" Fill="#FFF4F4F5" HorizontalAlignment="Left" Height="160" Margin="90,274,0,0" Stroke="Black" VerticalAlignment="Top" Width="257"/>

        </Grid>
    </Grid>
View Code

 

2.

namespace PhoneApp1
{
    public partial class Slider : PhoneApplicationPage
    {
        public Slider()
        {
            InitializeComponent();
            RedSilder.Value = 100;
            GreenSlider.Value = 120;
            BlueSlider.Value = 109;
            RedSilder.ValueChanged += RedSilder_ValueChanged;
            GreenSlider.ValueChanged += GreenSlider_ValueChanged;
            BlueSlider.ValueChanged += BlueSlider_ValueChanged;
            BindColor();
        }

        void BlueSlider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
        {
            BindColor();
        }

        void GreenSlider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
        {
            BindColor();
        }

        void RedSilder_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
        {
            BindColor();
        }

        private void BindColor()
        {
            Color c = Color.FromArgb(255, (byte)RedSilder.Value, (byte)GreenSlider.Value, (byte)BlueSlider.Value);
            ColorEll.Fill = new SolidColorBrush(c);
            RedText.Text = c.R.ToString("X2");
            GreenText.Text =c.G.ToString("X2");
            BlueText.Text = c.B.ToString("X2");
        }
       
    }
}
View Code

 

posted on 2013-09-22 15:18  MyBeN  阅读(519)  评论(0编辑  收藏  举报

导航