【发布时间】:2012-01-06 16:13:46
【问题描述】:
我想创建一个看起来像这张图片上最后两个的滑块:http://www.java2s.com/Code/JavaImages/SliderTest.PNG 但我希望顶部显示的值是线性变化的,10,100,1000,10000。 我想让用户定义这些值。
当我使用硬编码值创建样式时,一切正常:
<Grid x:Name="HorizontalTemplate" Margin="{StaticResource PhoneHorizontalMargin}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="12"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock Text="100m" Grid.Column="0" TextAlignment="Left"></TextBlock>
<TextBlock Text="500m" Grid.Column="1" TextAlignment="Center"></TextBlock>
<TextBlock Text="1km" Grid.Column="2" TextAlignment="Center"></TextBlock>
<TextBlock Text="10km" Grid.Column="3" TextAlignment="Center"></TextBlock>
<TextBlock Text="100km" Grid.Column="4" TextAlignment="Center"></TextBlock>
<TextBlock Text="All" Grid.Column="5" TextAlignment="Center" ></TextBlock>
</Grid>
<Rectangle x:Name="HorizontalFill" Fill="{TemplateBinding Foreground}" Height="12" IsHitTestVisible="False" Grid.Row="1"/>
<Rectangle x:Name="HorizontalTrack" Grid.Column="2" Fill="{TemplateBinding Background}" Height="12" IsHitTestVisible="False" Opacity="0.2" Grid.Row="1"/>
<RepeatButton x:Name="HorizontalTrackLargeChangeDecreaseRepeatButton" IsTabStop="False" Template="{StaticResource PhoneSimpleRepeatButton}" Grid.Row="1"/>
<RepeatButton x:Name="HorizontalTrackLargeChangeIncreaseRepeatButton" Grid.Column="2" IsTabStop="False" Template="{StaticResource PhoneSimpleRepeatButton}" Grid.Row="1"/>
<Thumb x:Name="HorizontalThumb" Grid.Column="1" Height="12" Width="12" Grid.Row="1">
<Thumb.Template>
<ControlTemplate>
<Canvas Background="{StaticResource PhoneForegroundBrush}" Height="12" Width="12">
<Rectangle Fill="Transparent" Height="84" IsHitTestVisible="True" Canvas.Left="-24" Canvas.Top="-22" Width="60"/>
</Canvas>
</ControlTemplate>
</Thumb.Template>
</Thumb>
</Grid>
但我将定义列的网格更改为:
<Grid Name="separatorsGrid" DataContext="{Binding GridSeparator}" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3"/>
并为其添加了一个依赖属性:
public static readonly DependencyProperty SeparatorProperty =
DependencyProperty.Register("Separators", typeof(List<string>), typeof(CustomSlider), null);
public static readonly DependencyProperty GridSeparatorProperty =
DependencyProperty.Register("GridSeparator", typeof(Grid), typeof(CustomSlider), null);
public CustomSlider()
{
DefaultStyleKey = typeof(CustomSlider);
}
public List<string> Separators
{
get{ return base.GetValue(SeparatorProperty) as List<string>; }
set
{
Grid maingrid = new Grid();
foreach (string separator in value)
{
ColumnDefinition col = new ColumnDefinition();
maingrid.ColumnDefinitions.Add(col);
}
int colNum = -1;
foreach (string gridColumn in value)
{
colNum++;
TextBlock textBlock = new TextBlock();
textBlock.Text = gridColumn;
Grid.SetRow(textBlock, 0);
Grid.SetColumn(textBlock, colNum);
maingrid.Children.Add(textBlock); // This line makes all the difference.
}
base.SetValue(GridSeparatorProperty, maingrid);
}
}
public Grid GridSeparator
{
get { return base.GetValue(GridSeparatorProperty) as Grid; }
set { base.SetValue(GridSeparatorProperty, value); }
}
由于某种原因,这不起作用,甚至没有调用一次依赖属性。 o.O 或者如果有人对此有类似的解决方案,那就太好了。
提前致谢
【问题讨论】:
-
您在
Grid中设置Separators的位置?<Grid Name="separatorsGrid" Separators={Binding ...} DataContext="{Binding GridSeparator}"... -
你不需要,在分隔符中设置分配给网格的 Gridseparator 属性。
-
请提供一些测试项目进行测试
-
depositfiles.com/files/l7tghmbzp。明天我会写哪里有问题
标签: windows-phone-7 styles custom-controls slider