2

次のように、Windows Phone 8 用の UserControl を開発しました。

<UserControl x:Class="SpinrWindowsMobile.UserControls.ProgressiveLongListSelector"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    d:DesignHeight="480" d:DesignWidth="480">

    <Grid x:Name="LayoutRoot" Background="{StaticResource PhoneChromeBrush}">
        <Grid.RowDefinitions>
            <RowDefinition Height="*"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
        </Grid.RowDefinitions>
        <phone:LongListSelector Grid.Row="0"  Name="longlistselector">
        </phone:LongListSelector>
        <StackPanel Grid.Row="1">
            <ProgressBar Name="listProress" IsIndeterminate="True"></ProgressBar>
            <TextBlock Name="ProgressText" Text="Loading..."></TextBlock>
        </StackPanel>
    </Grid>
</UserControl>

上記の xaml でわかるように、 Grid Control 内でLongListSelector と StackPanelを使用していました。次のように MainPage.xaml でこのコントロールを使用しています。

<phone:PhoneApplicationPage
    x:Class="SpinrWindowsMobile.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:UserControls="clr-namespace:SpinrWindowsMobile.UserControls"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    shell:SystemTray.IsVisible="True">
    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="Transparent">     
            <UserControls:ProgressiveLongListSelector>

            </UserControls:ProgressiveLongListSelector>

     </Grid>    
</phone:PhoneApplicationPage>

ここまででいいのですが、次のようなことをしたいです。

  <UserControls:ProgressiveLongListSelector>
                  <UserControls:ProgressiveLongListSelector.longlistselector 
                 ItemsSource="Binding" ItemTemplate="{staticresource myTemplate}">
                  </UserControls:ProgressiveLongListSelector.longlistselector>
    </UserControls:ProgressiveLongListSelector>

UserControlの要素/コンポーネントである longlistselectorにアクセスするにはどうすればよいですか? これの利点はです。私にとって、この種のものは今日の要件です。I can directly set the LongListSelector Properties in the xaml(in which i am embedding My usercontrol) itself

誰でもこれを行う方法を教えてもらえますか?

4

2 に答える 2

1

LongListSelector を拡張および変更しているため、LongListSelector を UserControl 内に配置するのではなく、サブクラス化して再テンプレート化することをお勧めします。これにより、LongListSelector の既存のすべてのプロパティとメソッドにアクセスし、LongListSelector とまったく同じように新しい ProgressiveLongListSelector を使用できるようになります。

まず、LongListSelector をサブクラス化する新しいクラスを作成できます。

public class ProgressiveLongListSelector : LongListSelector {

    public ProgressiveLongListSelector() {
        DefaultStyleKey = typeof(ProgressiveLongListSelector);
    }
}

DefaultStyleKeyに注意してください。そこから新しいコントロール テンプレートが生まれます。

これで、App.xaml リソースに次のスタイルを配置できます。TargetTypeProgressiveLongListSelectorであることに注意してください。これが、DefaultStyleKeyが新しいデフォルト スタイルを見つける方法です。

    <Style TargetType="phoneApp2:ProgressiveLongListSelector">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="phoneApp2:ProgressiveLongListSelector">
                    <Grid Background="{TemplateBinding Background}" d:DesignWidth="480" d:DesignHeight="800">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="ScrollStates">
                                <VisualStateGroup.Transitions>
                                    <VisualTransition GeneratedDuration="00:00:00.5" />
                                </VisualStateGroup.Transitions>
                                <VisualState x:Name="Scrolling">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="VerticalScrollBar" />
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="NotScrolling" />
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Grid Margin="{TemplateBinding Padding}">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*" />
                                <ColumnDefinition Width="auto" />
                            </Grid.ColumnDefinitions>
                            <ViewportControl x:Name="ViewportControl" HorizontalContentAlignment="Stretch" VerticalAlignment="Top" />
                            <ScrollBar x:Name="VerticalScrollBar" Grid.Column="1" Margin="4,0,4,0" Opacity="0" Orientation="Vertical" />
                        </Grid>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

このスタイル/テンプレートは、デフォルトの LongListSelector テンプレート (Blend から抽出) のコピーです。ここから、ProgressBar や TextBlock など、UserControl の他の要素をテンプレートに追加できます。

于 2013-02-24T03:12:34.083 に答える
0

できることは、DependencyProperty メカニズムを使用して UserContorl のプロパティを公開することです。次に、その UserControl を使用しているページから、XAML でそれらを設定できます。これは将来変更される可能性があるため、VisualTree のすべてのビットを公開するかどうかはわかりません。ただし、UserControl の動作に間接的に影響するいくつかのプロパティを公開できます。

これを行う方法の例を次に示します。

(この例は私のコードから取ったものですが、それを適応させる方法を理解できると思います)

まず、UserControl で DependencyProperty を宣言します。

public partial class MyUserControl : UserControl
{
    public bool IsEditingMode
    {
        get { return (bool)GetValue(IsEditingModeProperty); }
        set { SetValue(IsEditingModeProperty, value); }
    }

    public static readonly DependencyProperty IsEditingModeProperty =
        DependencyProperty.Register("IsEditingMode", typeof(bool), typeof(MyUserControl), new PropertyMetadata(false, IsEditingModeChanged));
}

private static void IsEditingModeChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
    // this will be called when someone would set the exposed property to some new value
}

次に MyUserControl を Page に追加し、そのプロパティを設定します。

<phone:PivotItem Header="{Binding Path=LocalizedResources.MyPivotHeader, Source={StaticResource LocalizedStrings}}" Margin="0">
    <my:MyUserControl x:Name="People" IsEditingMode="True"/>
</phone:PivotItem>

IsEditingModeが XAML でどのように設定されているかに注意してください。もちろん、public bool IsEditingModeプロパティ ラッパーを使用してコードから設定することもできますIsEditingModeProperty

于 2013-02-18T14:41:44.097 に答える