内容控制的内容在选项卡切换上消失

时间:2015-08-25 18:03:10

标签: wpf mvvm

我正在使用mvvm。我正在加载一个usercontrol,其中包含两个不同选项卡上的内容控件,如下所示:

<TabControl>
    <TabItem Header="View">
        <StackPanel>
            <Info:UserData/><!--UserData Control-->
            <Button Content="View Entries" Command="{Binding BeginView}"/>
        </StackPanel>
    </TabItem >
    <TabItem Header="Edit">
        <StackPanel>
            <Info:UserData/><!--UserData Control-->
            <Button Content="Edit Entries" Command="{Binding BeginEdit}"/>
        </StackPanel>
    </TabItem >
</TabControl>

用户控件如下所示:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <ContentControl Grid.Row="0" Content="{Binding UserTypeInfo}"/>
    <Info:UserDetailsArea Grid.Row="1"/>
</Grid>

当选项卡首次加载时,ContentControl的内容将设置为图像。根据某些操作,内容可能会更改为数据表,视频等。此部分工作正常。

加载时,默认选项卡是第一个。如果我单击第二个选项卡,您应该看到相同的东西 - 使用不同的按钮,这是有效的。但是,如果我返回第一个标签,则内容控件为空。

我需要做什么才能让两个标签显示图像?

根据请求从viewmodel绑定的值:

private object userTypeInfo
/// <summary>
/// User Specific data
/// </summary>
public object UserTypeInfo
{
    get
    {
        return userTypeInfo;
    }
    private set
    {
        UuserTypeInfo= value;
        OnPropertyChanged("UserTypeInfo");
    }
}

编辑: 以下是一个简化示例,我认为它显示了同样的问题:

窗口的XAML代码:

<Window x:Class="dualCC.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525"
        Loaded="Window_Loaded">
    <Grid>
        <TabControl>
            <TabItem Header="One">
                <StackPanel>
                    <Button Content="One" />
                    <ContentControl Name="CCone"/>
                </StackPanel>
            </TabItem>
            <TabItem Header="Two">
                <StackPanel>
                    <Button Content="Two" />
                    <ContentControl Name="CCtwo"/>
                </StackPanel>
            </TabItem>
        </TabControl>
    </Grid>
</Window>

代码背后(您需要修复图像的路径):

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace dualCC
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void Window_Loaded(object sender, RoutedEventArgs e)
        {
            Uri uri = new Uri(@"C:\Image.jpg");
            BitmapImage temp = new BitmapImage(uri);
            Image CurrentImage = new Image();
            CurrentImage.Source = temp;

            CCone.Content = CurrentImage;
            CCtwo.Content = CurrentImage;
        }
    }
}

1 个答案:

答案 0 :(得分:1)

这不是MVVM。在MVVM中,你永远不会像这样在代码隐藏中直接操作GUI元素。

要回答您的问题,问题是您正在创建Image,它实际上是一个子控件,并将其设置为两个单独控件的内容。控件只能有一个父级。改为创建单独的图像并将BitmapImage设置为每个图像的源:

    private void Window_Loaded(object sender, RoutedEventArgs e)
    {
        Uri uri = new Uri(@"C:\Image.jpg");
        BitmapImage temp = new BitmapImage(uri);

        CCone.Content = new Image { Source = temp };
        CCtwo.Content = new Image { Source = temp };
    }

或者更好地使用适当的MVVM并使用数据绑定。