1

我使用了本页所示的 DataTemplateSelector 示例，并对其进行了一些修改以满足我的要求，如下所示。

public abstract class TemplateSelector : ContentControl
{
    public abstract DataTemplate SelectTemplate(object item, DependencyObject container);

    protected override void OnContentChanged(object oldContent, object newContent)
    {
        base.OnContentChanged(oldContent, newContent);

        var parent = GetParentByType<LongListSelector>(this);

        ContentTemplate = SelectTemplate(newContent, this);
    }

    private static T GetParentByType<T>(DependencyObject element) where T : FrameworkElement
    {
        T result = null;
        DependencyObject parent = VisualTreeHelper.GetParent(element);

        while (parent != null)
        {
            result = parent as T;

            if (result != null)
            {
                return result;
            }

            parent = VisualTreeHelper.GetParent(parent);
        }

        return null;
    }
}


public class MyTemplateSelector : TemplateSelector
{
    public DataTemplate one { get; set; }
    public DataTemplate two { get; set; }
    public DataTemplate three { get; set; }
    public DataTemplate four { get; set; }
    public DataTemplate five { get; set; }
    public DataTemplate six { get; set; }
    public DataTemplate seven { get; set; }
    public DataTemplate eight { get; set; }
    public DataTemplate nine { get; set; }

    public override DataTemplate SelectTemplate(object item, DependencyObject container)
    {
        PoiData poiItem = item as PoiData;

        if (poiItem != null)
        {
            switch (poiItem.Type)
            {
                case "atm":
                    return one;

                case "food":
                    return two;

                case "hospital":
                    return three;

                case "police":
                    return four;

                case "pharmacy":
                    return five;

                case "gas_station":
                    return six;

                case "hindu_temple":
                    return seven;

                case "train_station":
                    return eight;

                case "movie_theater":
                    return nine;

            }
        }
        return null;
    }
}

我的 xaml 看起来像这样。

<phone:PhoneApplicationPage.Resources>

<DataTemplate x:Key="one">
        <StackPanel Height="75">
            <Grid Height="65"
                  Background="Red"
                  HorizontalAlignment="Left"          
                  Margin="0, 0, 0, 12">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="65" />
                    <ColumnDefinition Width="auto" />
                </Grid.ColumnDefinitions>
                <Grid VerticalAlignment="Top"
                                  HorizontalAlignment="Left"
                                  Width="65"
                                  Height="65"
                                  Background="White"
                                  Grid.Column="0"
                                  Margin="0, 0, 0, 0">
                </Grid>
                <Grid Grid.Column="1" Width="auto">
                    <TextBlock Text="{Binding Title}" 
                               FontSize="30" Margin="10,0,0,0" 
                               VerticalAlignment="Center" 
                               Foreground="White"/>
                </Grid>

            </Grid>
        </StackPanel>
</DataTemplate>
.
.
.
</phone:PhoneApplicationPage.Resources>

<DataTemplate x:Key="SelectingTemplate">
            <local:MyTemplateSelector Content="{Binding}"
                                      one="{StaticResource one}"
                                      two="{StaticResource two}"
                                      three="{StaticResource three}"
                                      four="{StaticResource four}"
                                      five="{StaticResource five}"
                                      six="{StaticResource six}"
                                      seven="{StaticResource seven}"
                                      eight="{StaticResource eight}"
                                      nine="{StaticResource nine}" />
</DataTemplate>

这是全景项目 xaml

<phone:PanoramaItem Header="{Binding Path=LocalizedResources.AroundMe, Source={StaticResource LocalizedStrings}}">
                <!--Double wide Panorama with large image placeholders-->
                <phone:LongListSelector Margin="12,-20,0,75"
                                        ItemsSource="{Binding Poi.Items}"
                                        ItemTemplate="{StaticResource SelectingTemplate}"
                                        SelectionChanged="PoiSelectionChanged" >
                </phone:LongListSelector>
            </phone:PanoramaItem>

我的问题是，如果我使用此代码，无论我设置为or或，stackpanel总是将自身与项目的中心对齐。panoramaHorizontalAlignmentleftrightstretch

如果我将孩子或孩子的width属性设置为占用整个屏幕空间，我会收到一个我认为完全不相关的错误。stackpanelgrid*

{MS.Internal.WrappedException: Error HRESULT E_FAIL has been returned from a call to a COM component. ---> System.Exception: Error HRESULT E_FAIL has been returned from a call to a COM component.
at MS.Internal.XcpImports.CheckHResult(UInt32 hr)
at MS.Internal.XcpImports.FrameworkElement_MeasureOverride(FrameworkElement element, Size availableSize)
at System.Windows.FrameworkElement.MeasureOverride(Size availableSize)
at System.Windows.FrameworkElement.MeasureOverride(IntPtr nativeTarget, Double inWidth,     Double inHeight, Double& outWidth, Double& outHeight)
--- End of inner exception stack trace ---}

我到底应该怎么做才能将stackpanel's 宽度设置为占据整个屏幕宽度？有什么解决方法吗？

为什么当我设置width为*.

4

2 回答 2

2

解决您的问题的两件事

  1. 删除父堆栈面板，仅将 Grid 作为 DataTemplate 的内容
  2. 将第二个 ColumnDefinition 的宽度设置为 '*'

为什么这行得通？

  1. StackPanel 旨在尽可能少地占用空间。因此，将 StackPanel 作为“父元素”或 DataTemplate 的内容会使您的内容“缩小”到其所告知的空间（通过设置显式宽度）。
  2. 网格的第二列被告知“自动”大小。这意味着只占用渲染所需的空间（就像 StackPanel 所做的那样！）。将大小设置为“*”会告诉列占用尽可能多的空间。
于 2013-10-31T18:45:34.780 回答
1

我找到了解决方案！我在这里谷歌搜索：http ://webcache.googleusercontent.com/search?q=cache:KDZZtrw9eG0J:y2bd.me/blog/2013/08/16/fixing-alignment-issues-with-datatemplateselector/+&cd=6&hl =en&ct=clnk&gl=us

基本上，引用 TemplateSelector 的 XAML 标记需要将 Horizo​​ntalContentAlignment 设置为拉伸。像这样的东西：

<DataTemplate x:Key="YourTemplateSelectorKey">
    <namespace:YourTemplateSelectorClass HorizontalContentAlignment="Stretch" ... />
</DataTemplate>

多田！

于 2014-02-08T22:43:30.630 回答