选项卡式webbrowser控件

时间:2012-03-11 20:01:04

标签: c# windows-phone-7

我想创建一个用户在我的Windows Phone应用程序中打开多个webbrowser实例的能力,但是我找不到任何解释如何实现这一目标的文档。更确切地说,我想模仿默认Windows Phone Internet Explorer应用程序提供的选项卡式浏览体验。已经有一个webbrowser isntance正常使用导航和诸如此类的东西,但是我如何才能添加多个'tabbed'实例,以便每个webbrowser实例可以同时在一个单独的页面上? (我对C#和Windows手机比较陌生,所以任何代码,链接或详细解释都会非常感激。)提前致谢!

我的代码如下:

MainPage.xaml中

<Grid x:Name="LayoutRoot">

    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>

    <my:FullWebBrowser Name="TheBrowser" Grid.RowSpan="2" InitialUri="http://www.google.com" Height="800" Margin="0,0,0,-690" />

</Grid>

TabsPage.xaml

<Grid x:Name="ContentPanel" Grid.Row="0" Margin="12,0,12,0"></Grid>
</Grid>


<phone:PhoneApplicationPage.ApplicationBar>
    <shell:ApplicationBar IsVisible="True">
        <shell:ApplicationBarIconButton IconUri="/Icons/appbar.new.rest.png" IsEnabled="True" Text="new" x:Name="NewBtn" Click="NewBtn_Click"/>
                </shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>

现在TabsPage.xaml是空白的,除了应用栏图标,应该允许在点击时创建新的webbrowser实例。

1 个答案:

答案 0 :(得分:0)

我不会为标签创建单独的页面,我的第一个是创建多个浏览器控件,并且只显示当前标签的浏览器控件。

编辑:

通常没有人会这样做,但我为你写了一个简单的多标签浏览器应用程序。这是非常原始的,但你会明白的。顺便说一句,你应该更加努力想出一个解决方案,这真的不难......这是MainPage.xaml:

<Grid x:Name="LayoutRoot">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <TextBox x:Name="UrlTextBox"
             KeyDown="UrlTextBox_KeyDown" />
    <Grid x:Name="BrowserHost"
          Grid.Row="1" />
</Grid>

<phone:PhoneApplicationPage.ApplicationBar>
    <shell:ApplicationBar>
        <shell:ApplicationBar.MenuItems>
            <shell:ApplicationBarMenuItem Text="1"
                                          Click="TabMenuItem_Click" />
            <shell:ApplicationBarMenuItem Text="2"
                                          Click="TabMenuItem_Click" />
            <shell:ApplicationBarMenuItem Text="3"
                                          Click="TabMenuItem_Click" />
            <shell:ApplicationBarMenuItem Text="4"
                                          Click="TabMenuItem_Click" />
        </shell:ApplicationBar.MenuItems>
    </shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>

这是MainPage.xaml.cs:

public partial class MainPage : PhoneApplicationPage
{
    private const int NumTabs = 4;

    private int currentIndex;
    private string[] urls = new string[NumTabs];
    private WebBrowser[] browsers = new WebBrowser[NumTabs];

    public MainPage()
    {
        InitializeComponent();
        ShowTab(0);
    }

    private void ShowTab(int index)
    {
        this.currentIndex = index;
        UrlTextBox.Text = this.urls[this.currentIndex] ?? "";
        if (this.browsers[this.currentIndex] == null)
        {
            WebBrowser browser = new WebBrowser();
            this.browsers[this.currentIndex] = browser;
            BrowserHost.Children.Add(browser);
        }
        for (int i = 0; i < NumTabs; i++)
        {
            if (this.browsers[i] != null)
            {
                this.browsers[i].Visibility = i == this.currentIndex ? Visibility.Visible : Visibility.Collapsed;
            }
        }
    }

    private void UrlTextBox_KeyDown(object sender, KeyEventArgs e)
    {
        if (e.Key == Key.Enter)
        {
            Uri url;
            if (Uri.TryCreate(UrlTextBox.Text, UriKind.Absolute, out url))
            {
                this.urls[this.currentIndex] = UrlTextBox.Text;
                this.browsers[this.currentIndex].Navigate(url);
            }
            else
                MessageBox.Show("Invalid url");
        }
    }

    private void TabMenuItem_Click(object sender, EventArgs e)
    {
        int index = Int32.Parse(((ApplicationBarMenuItem)sender).Text) - 1;
        ShowTab(index);
    }
}