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>

私の問題は、このコードを使用すると、またはまたはに設定しても、stackpanel常にpanoramaアイテムの中心に整列することです。HorizontalAlignmentleftrightstretch

または子の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の幅を画面全体の幅に設定するには、どうすればよいですか? 回避策はありますか?

widthを に設定すると、この例外がスローされるのはなぜですか*。

4

2 に答える 2

2

あなたの問題を解決するための2つのこと

  1. 親スタックパネルを削除し、グリッドのみを DataTemplate のコンテンツとして持つ
  2. 2 番目の ColumnDefinition の幅を '*' に設定します

なぜこれが機能するのですか？

  1. StackPanels は、スペースをできるだけ消費しないように構築されています。そのため、「親要素」または DataTemplate のコンテンツとして StackPanel を使用すると、 (明示的な幅を設定することによって) 指定されたスペースだけにコンテンツが「縮小」されます。
  2. グリッドの 2 列目は「自動」サイズに指定されました。これは、レンダリングに必要なだけのスペースしか占有しないことを意味します (ちょうど StackPanel が行っていたように!)。サイズを「*」に設定すると、列が利用可能な最大のスペースを取るように指示されます。
于 2013-10-31T18:45:34.780 に答える