Busyindicatorをどこに配置してページ全体をラップするので、アクティビティが完了するまで制御が有効になりません

Question

MVVMライトを備えたSilverlight 4でアプリを作成しています。

現在、私は多くのコントロールを持つページを持っています。スタックパネル、リストボックス、テックスブロック、ボタン。 PageModelにバインドされているBusyindicatorがページにあります。ボタンをクリックすると、データベースからデータを取得すると表示されます。BushingIndicatorは、呼び出しが完了したときに表示され、消滅します。

これはすべて正常に機能します。

私が起こりたいのは、ページ全体がBusyindicatorに包まれているため、ページが暗くなり、イベントが完了するまで何も機能しないことです。私はあなたがBusyindicatorの中にコントロールを包むだけであることを読みました。インジケーターの開口部をどこに置いても、青い線が表示されます」プロパティコンテンツは複数回設定されています。」以下にコードを投稿しましたが、インジケータコードをどこに配置するかを説明できますか。

        <Grid.RowDefinitions>
            <RowDefinition Height ="0" />
            <RowDefinition Height ="30" />
            <RowDefinition Height ="60" />
            <RowDefinition Height ="Auto" />
            <RowDefinition Height ="40" />
        </Grid.RowDefinitions>

        <TextBlock Grid.Row="1" Grid.Column="0" Text="Header" Width="353" Margin="0 0 0 0" Height="30" />

        <StackPanel Grid.Row="2"  VerticalAlignment="Center" Orientation="Horizontal" >

            <Button Grid.Row="2" Grid.Column="0" Content="GetData" Height="35" Width="130" HorizontalAlignment="Left" Margin="0,0,0,0"  Command="{Binding GetData}"></Button>
            <!--  <toolkit:BusyIndicator Width="150" Height="50" IsBusy="{Binding IsBusy}" BusyContent="Searching ..."  /> -->

        </StackPanel>

        <ListBox x:Name="MyListBox" Grid.Row="3">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"></RowDefinition>
                            <RowDefinition Height="Auto"></RowDefinition>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="400"></ColumnDefinition>
                            <ColumnDefinition Width="70"></ColumnDefinition>
                            <ColumnDefinition Width="10"></ColumnDefinition>
                            <ColumnDefinition Width="70"></ColumnDefinition>
                        </Grid.ColumnDefinitions>

                        <TextBlock Grid.Row="0" Grid.Column="0" VerticalAlignment="Center" Text="{Binding Name}"></TextBlock>

                        <Button Grid.Row="0" Grid.RowSpan="2" Grid.Column="3" Content="Delete" VerticalAlignment="Center" 
                            Command="{Binding Delete}"></Button>
                    </Grid>

                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

        <TextBlock Grid.Row="4" Margin="5,10,0,0" Text="{BindingMessage}"></TextBlock>

</Grid>

Answer 1

以下に示すように、すべてのコンテンツをユーザーコントロール内に配置する必要があります。

<toolkit:BusyIndicator Width="150" Height="50" IsBusy="{Binding IsBusy}" BusyContent="Searching ...">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height ="0" />
            <RowDefinition Height ="30" />
            <RowDefinition Height ="60" />
            <RowDefinition Height ="Auto" />
            <RowDefinition Height ="40" />
        </Grid.RowDefinitions>
        <TextBlock Grid.Row="1" Grid.Column="0" Text="Header" Width="353" Margin="0 0 0 0" Height="30" />
        <StackPanel Grid.Row="2"  VerticalAlignment="Center" Orientation="Horizontal" >
            <Button Grid.Row="2" Grid.Column="0" Content="GetData" Height="35" Width="130" HorizontalAlignment="Left" Margin="0,0,0,0"  Command="{Binding GetData}"></Button>

        </StackPanel>
        <ListBox x:Name="MyListBox" Grid.Row="3">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"></RowDefinition>
                            <RowDefinition Height="Auto"></RowDefinition>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="400"></ColumnDefinition>
                            <ColumnDefinition Width="70"></ColumnDefinition>
                            <ColumnDefinition Width="10"></ColumnDefinition>
                            <ColumnDefinition Width="70"></ColumnDefinition>
                        </Grid.ColumnDefinitions>
                        <TextBlock Grid.Row="0" Grid.Column="0" VerticalAlignment="Center" Text="{Binding Name}"></TextBlock>
                        <Button Grid.Row="0" Grid.RowSpan="2" Grid.Column="3" Content="Delete" VerticalAlignment="Center"                              Command="{Binding Delete}"></Button>
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
        <TextBlock Grid.Row="4" Margin="5,10,0,0" Text="{BindingMessage}"></TextBlock>
    </Grid>
</toolkit:BusyIndicator>