Silverlight - привязка фактической ширины списка к ширине элемента списка
Я работаю над фотогалереей для Windows Phone 7 и пытаюсь сделать так, чтобы каждое изображение занимало весь экран и скользило по горизонтали. До сих пор я использовал список, который я изменил, для горизонтальной прокрутки, но проблема в том, что я не могу найти способ связать ширину и высоту элемента ListboxItem с ActualWidth и ActualHeight списка. сам. Причина, по которой я хочу это сделать, заключается в том, что, если ориентация телефона изменится, размер фотографий также изменится, чтобы соответствовать экрану.
Ниже приведен код, который я получил до сих пор (я пытался использовать TemplatedParent и RelativeSource, но я, должно быть, делал что-то не так, поскольку он вообще не работает):
<Style x:Key="PhotoGalleryItem" TargetType="ListBoxItem">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="VerticalContentAlignment" Value="Stretch"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<Grid x:Name="ListBoxItemRoot" HorizontalAlignment="Stretch" Margin="4,0,4,0" Width="{Binding RelativeSource={RelativeSource TemplatedParent},Path=ActualWidth}">
<Image Source="{Binding Mode=OneWay}" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style TargetType="controls:PhotoGallery">
<Setter Property="Background" Value="Red"/>
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Disabled"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="BorderBrush" Value="Transparent"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="ItemsPanel">
<Setter.Value>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</Setter.Value>
</Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="controls:PhotoGallery">
<Border BorderBrush="Transparent" BorderThickness="0" >
<Grid x:Name="LayoutRoot" Background="{TemplateBinding Background}">
<ScrollViewer x:Name="Scroller" VerticalScrollBarVisibility="Hidden" HorizontalScrollBarVisibility="Hidden" >
<ItemsPresenter/>
</ScrollViewer>
</Grid>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="ItemContainerStyle" Value="{StaticResource PhotoGalleryItem}" />
</Style>
Есть идеи, как этого добиться?
Спасибо
2 ответа
Это может быть похоже на этот вопрос, который я задавал раньше
Add HorizontalContentAlignment="Stretch" to your ListBox.
That should do the trick.
Я вижу, что у вас уже есть "HCA" с сеттером, поэтому я не совсем уверен, что происходит.
Вы можете сделать это в коде:
public static void bindItemWidthToListBoxWidth(FrameworkElement cell)
{
ListBox parent = findListBoxParent(cell);
if(parent != null)
{
Binding binding = new Binding();
binding.Source = parent;
binding.Path = new PropertyPath("ActualWidth");
binding.Mode = BindingMode.OneWay;
cell.SetBinding(Grid.WidthProperty, binding);
}
}
public static ListBox findListBoxParent(DependencyObject el)
{
ListBox retValue = findAncestor<ListBox>(el);
return retValue;
}
public static tType findAncestor<tType>(DependencyObject el)
where tType : DependencyObject
{
tType retValue = null;
DependencyObject parent = VisualTreeHelper.GetParent(el);
if(parent != null)
{
if (parent is tType)
{
retValue = (tType)parent;
}
else
{
retValue = findAncestor<tType>(parent);
}
}
return retValue;
}