XAML-将内容添加到选项卡式窗口

Question

我正在使用一个用C＃编写的应用程序-该应用程序的主显示是使用Visual Studio中的XAML标记编写/创建的，并且该应用程序根据需要执行其所有当前功能。

我的意图是在应用程序中嵌入Web浏览器，以允许用户直接从应用程序内部与特定网站进行交互。

为此，我想在应用程序内部创建一个“选项卡式”显示，第一个选项卡将按当前状态显示该应用程序，并允许用户以与当前相同的方式与其交互。 第二个选项卡将在应用程序窗口内向用户显示网站，从而允许用户以与在Web浏览器中相同的方式与网站进行交互。

显示当前应用程序的.xaml文件中的xml如下：

<Window x:Class="RiviamAgent.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="RIVIAM | CONNECTOR" Height="640" Width="640"
    ResizeMode="NoResize">

<Grid>
    <Menu IsMainMenu="True" Background="White">
        <MenuItem Header="_View">
            <MenuItem Header="_Connections">
                <MenuItem x:Name="rivMenu" Header="_RIVIAM Cloud" Click="connectorInfo">
                </MenuItem>
                <Separator />
                <MenuItem x:Name="tppMenu" Header="_TPP SystmOne" Click="connectorInfo">
                </MenuItem>
                <MenuItem x:Name="emisMenu" Header="_EMIS Web" Click="connectorInfo">
                </MenuItem>
            </MenuItem>
            <MenuItem Header="_Diagnostics" Click="diagMode"/>
            <MenuItem Header="_About" Click="About_Riviam"/>
        </MenuItem>
    </Menu>


    <Image x:Name="rivlogo" Height="128" Width="128" Margin="451,49,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" Source="ic_launcher.png"/>
    <Image x:Name="connectedFlag" Height="30" Width="30" Margin="479,193,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" Source="cloud.png"/>
    <Image x:Name="disconnectedFlag" Height="30" Width="30" Margin="479,193,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" Source="cloud_dark.png"/>
    <TextBlock x:Name="unsentMsgs" Height="30" Width="30" Margin="479,193,0,0" HorizontalAlignment="Left" VerticalAlignment="Top"  Text="!"/>

    <Image x:Name="tppFlag" Source="tppswoosh.png"  Margin="529,193,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" Height="30" Width ="60"/>
    <Image x:Name="emisFlag" Source="emiswoosh.png"  Margin="529,193,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" Height="30" Width ="60"/>


    <TextBlock x:Name="blah1" HorizontalAlignment="Left" Margin="41,52,0,0" TextWrapping="Wrap" Text="Select service to refer to:" VerticalAlignment="Top"/>
    <TextBlock x:Name="blah2" HorizontalAlignment="Left" Margin="41,89,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Height="56" Width="136"><Run Text="Select referral document:
                                                                                                                                                           (or drag it to the logo)"/></TextBlock>
    <TextBlock x:Name="blahfoot" HorizontalAlignment="Left" Margin="319,10,0,0" TextWrapping="Wrap" Text="RIVIAM - Secure cloud for Health and Social Care" VerticalAlignment="Top" Height="24" Width="260"/>

    <ComboBox x:Name="serviceList" Text="pls select"  HorizontalAlignment="Left" Margin="182,49,0,0" VerticalAlignment="Top" Width="218" ></ComboBox>
    <TextBox x:Name="fileName" Text=" " MaxLines="1" IsReadOnly="True" Margin="182,90,0,0" HorizontalAlignment="Left" VerticalAlignment="Top"  Height="23" Width="161"/>
    <Button x:Name="fileBtn" Content="Browse" HorizontalAlignment="Left" Margin="348,90,0,0" VerticalAlignment="Top" Width="52" Click="fileUpload" Height="23"/>
    <Button x:Name="referBtn" Content="Send Referral and Patient Record" HorizontalAlignment="Left" Margin="182,150,0,0" VerticalAlignment="Top" Width="218" Click="referThis" Height="23"/>

    <TextBlock x:Name="blahfoot_Copy" HorizontalAlignment="Left" Margin="39,198,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Height="49" Width="361"><Run FontWeight="Bold" Text="Notice"/><Run Text=": "/><Run Text="You must ensure that the patient has agreed to their data being shared "/><Run Text="with the provider. Please contact the RIVIAM help desk on 01225 945 020 if you are unsure."/></TextBlock>

    <!-- end of normal view -->

    <ScrollViewer x:Name="scroller" HorizontalAlignment="Left" VerticalScrollBarVisibility="Auto" Margin="39,329,0,0" VerticalAlignment="Top" Height="244" Width="327">
        <TextBox x:Name="infoPane" TextWrapping="Wrap" Text="nothing" IsReadOnly="True"/>
    </ScrollViewer>

    <Button x:Name="f1Btn" Content="view Logs" HorizontalAlignment="Left" Margin="408,361,0,0" VerticalAlignment="Top" Width="121" Click="testFunction1"/>
    <Button x:Name="f2Btn" Content="delete logs" HorizontalAlignment="Left" Margin="408,393,0,0" VerticalAlignment="Top" Width="121" Click="testFunction2"/>
    <Button x:Name="f3Btn" Content="test function 3" HorizontalAlignment="Left" Margin="408,425,0,0" VerticalAlignment="Top" Width="121" Click="testFunction3"/>

    <Button x:Name="cntxtBtn" Content="context" HorizontalAlignment="Left" Margin="408,553,0,0" VerticalAlignment="Top" Width="121" Click="Context_Click"/>

</Grid>

我现在正在尝试编辑XML以显示两个选项卡-一个显示应用程序的位置，第二个显示网站。

不过我不确定的是，一旦添加了<TabControl></TabControl>标记，该如何在<TabItem></TabItem>标记内显示当前标记（针对当前的应用程序） ？

我尝试在</Menu>标记下编写以下内容：

<TabControl>
    <TabItem Header="Application">
        ...
        Existing markup goes here...
        ...
    </TabItem>
</TabControl>

但是，当我这样做时，现有标记的第一行看起来不错，但是其余的部分都带有下划线（表明存在编译错误）。 将光标悬停在其上时显示的错误消息是

属性“内容”已设置多次。

因此，我的问题是：如何在这些TabItem之一中而不是像以前一样直接在窗口中显示应用程序的正常显示？

我在http://www.wpf-tutorial.com/tabcontrol/using-the-tabcontrol/上遵循的教程仅显示了如何在Tab内容中显示简单文本...

Answer 1

嗯，看来这样做的方法是使用<StackPanel></StackPanel>

Answer 2

TabItem需要Layout控件之一。 您可以使用Grid StackPanel或Canvas来满足您的需求

例如

<TabControl>
<TabItem Header="Application">
   <Grid>
      Existing markup goes here...
   </Grid>
</TabItem>