Question

我在Windows 8商店应用的GridApp的itemsdetail页面的flipview中使用MediaElement Control，我正面临着使用它的一种特殊类型的问题。 MediaElement不显示视频，目标视频输出上只有黑屏，但播放视频的音频就好了。

现在我的问题的特殊部分是在网格应用程序中有一组项目的集合（我知道每个人都可能知道这一点，只是为了让自己清楚），每个小组的第一项播放视频很好，我的意思是它显示视频和音频就好了，但该组的其他项目只是不显示视频只播放视频的音频。有人知道为什么会这样吗？

这是XAML代码：

 <FlipView
x:Name="flipView"
AutomationProperties.AutomationId="ItemsFlipView"
AutomationProperties.Name="Item Details"
TabIndex="1"
Grid.RowSpan="2"
ItemsSource="{Binding Source={StaticResource itemsViewSource}}">

<FlipView.ItemContainerStyle>
    <Style TargetType="FlipViewItem">
        <Setter Property="Margin" Value="0,137,0,0"/>
    </Style>
</FlipView.ItemContainerStyle>

<FlipView.ItemTemplate>
    <DataTemplate>
        <UserControl Loaded="StartLayoutUpdates" Unloaded="StopLayoutUpdates">
            <ScrollViewer x:Name="scrollViewer" Style="{StaticResource VerticalScrollViewerStyle}" Grid.Row="1">
                <Grid Margin="120,0,20,20">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="400" />
                        <ColumnDefinition Width="40" />
                        <ColumnDefinition Width="360" />
                        <ColumnDefinition Width="40" />
                        <ColumnDefinition />
                    </Grid.ColumnDefinitions>
                    <Border BorderBrush="Black" BorderThickness="1" Width="350" HorizontalAlignment="Left" Grid.Row="0">
                        <MediaElement x:Name="VideoSource" AutomationProperties.Name="VideoSource" Source="/Assets/Big_Buck_Bunny.mp4" HorizontalAlignment="Center" VerticalAlignment="Stretch" Height="250" Width="350" AutoPlay="False" IsLooping="True" />
                    </Border>
                    <Border BorderBrush="Black" BorderThickness="1" Height="65" Width="350" HorizontalAlignment="Left" Grid.Row="1">
                        <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center">
                            <Button x:Name="playButton" Margin="0,0" Click="playButton_Click" Style="{StaticResource PlayAppBarButtonStyle}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                            <Button x:Name="pauseButton" Margin="0,0" Click="pauseButton_Click" Style="{StaticResource PauseAppBarButtonStyle}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        </StackPanel>
                    </Border>
                </Grid>
            </ScrollViewer>
        </UserControl>
    </DataTemplate>
</FlipView.ItemTemplate>

这是背后的代码：

    private void playButton_Click(object sender, RoutedEventArgs e)
    {
        MediaElement media = FindControl<MediaElement>(this, "VideoSource") as MediaElement;
        media.Play();
    }

    private void pauseButton_Click(object sender, RoutedEventArgs e)
    {
        MediaElement media = FindControl<MediaElement>(this, "VideoSource") as MediaElement;
        media.Pause();
    }

    private void stopButton_Click(object sender, RoutedEventArgs e)
    {
        MediaElement media = FindControl<MediaElement>(this, "VideoSource") as MediaElement;
        media.Stop();
    }

    private DependencyObject FindControl<T>(DependencyObject controlType, string ctrlName)
    {
        int childNumber = VisualTreeHelper.GetChildrenCount(controlType);
        for (int i = 0; i < childNumber; i++)
        {
            DependencyObject child = VisualTreeHelper.GetChild(controlType, i);
            FrameworkElement fe = child as FrameworkElement;
            // Not a framework element or is null
            if (fe == null) return null;

            if (child is T && fe.Name == ctrlName)
            {
                // Found the control so return
                return child;
            }
            else
            {
                // Not found it - search children
                DependencyObject nextLevel = FindControl<T>(child, ctrlName);
                if (nextLevel != null)
                    return nextLevel;
            }
        }
        return null;
    }

我希望我能清楚地说明这个问题。

Answer 1

所以，你正在尝试的将会奏效。不过，为了帮助我，我写了一个小原型。

使用此代码：

public sealed partial class MainPage : Page
{
    public MainPage()
    {
        this.InitializeComponent();
    }

    private void Button_Click_1(object sender, RoutedEventArgs e)
    {
        // pause
        var _Media = GetMediaElement(sender as Button);
        _Media.Pause();
    }

    private void Button_Click_2(object sender, RoutedEventArgs e)
    {
        // play
        var _Media = GetMediaElement(sender as Button);
        _Media.Play();
    }

    MediaElement GetMediaElement(Button button)
    {
        var _Parent = button.Parent as Grid;
        var _GrandParent = _Parent.Parent as Grid;
        return _GrandParent.Children.First() as MediaElement;
    }

    private void FlipView_SelectionChanged_1(object sender, SelectionChangedEventArgs e)
    {
        var _FlipView = sender as FlipView;
        foreach (var item in _FlipView.Items)
        {
            var _Container = _FlipView.ItemContainerGenerator.ContainerFromItem(item);
            var _Children = AllChildren(_Container);
            foreach (var media in _Children)
                media.Pause();
        }
    }

    public List<MediaElement> AllChildren(DependencyObject parent)
    {
        if (parent == null)
            return (new MediaElement[] { }).ToList();
        var _List = new List<MediaElement> { };
        for (int i = 0; i < VisualTreeHelper.GetChildrenCount(parent); i++)
        {
            var _Child = VisualTreeHelper.GetChild(parent, i);
            if (_Child is MediaElement)
                _List.Add(_Child as MediaElement);
            _List.AddRange(AllChildren(_Child));
        }
        return _List;
    }
}

并使用此XAML：

<FlipView SelectionChanged="FlipView_SelectionChanged_1">
    <FlipView.ItemTemplate>
        <DataTemplate>
            <Grid>
                <MediaElement Source="{Binding}" AutoPlay="False" />
                <Grid Margin="20" VerticalAlignment="Bottom" Background="Black">
                    <Button Click="Button_Click_1" HorizontalAlignment="Left">Pause</Button>
                    <Button Click="Button_Click_2" HorizontalAlignment="Right">Play</Button>
                </Grid>
            </Grid>
        </DataTemplate>
    </FlipView.ItemTemplate>
    <x:String>ms-appx:/Assets/BestSingingVideoEver.wmv</x:String>
    <x:String>ms-appx:/Assets/BestSingingVideoEver.wmv</x:String>
    <x:String>ms-appx:/Assets/BestSingingVideoEver.wmv</x:String>
    <x:String>ms-appx:/Assets/BestSingingVideoEver.wmv</x:String>
</FlipView>

确保使用您自己的视频更新路径。当然，您也可以对列表进行数据绑定。我的代码只是一个原型来证明你想要做的事情是可能的。祝你好运！

我还认为我可能已经解决了你的代码中的一两个错误。特别是你在列表中寻找子控件的部分。以下是我的参考：http://blog.jerrynixon.com/2012/09/how-to-access-named-control-inside-xaml.html

MediaElement控件不显示视频只播放Grid App中视频的音频

1 个答案: