Как создать AppBar в Metro, который работает в WebView?

Итак, я получил обычный AppBar для работы в метро-приложении C #, но проблема в том, что мне нужно приложение для отображения html-страницы. Я создаю WebView, который занимает 100% ширины и высоты страницы, и поэтому AppBar больше не отображается при щелчке правой кнопкой мыши и пролистывании края. Есть ли способ для AppBar работать с таким WebView?

--Решено--

В итоге я добавил границу в 1 пиксель вокруг WebView, чтобы можно было обнаружить свайпы. Поскольку то, что я включил в свой WebView, динамически меняется со временем, WebViewBrush у меня не сработал. Вместо этого я просто уменьшил размер WebView при открытии AppBar, а затем расширил его, когда он был закрыт.


webview appbar windows-runtime winrt-xaml windows-8
person Joshua Mak    schedule 30.07.2012    source источник

Ответы (3)


arrow_upward
2
arrow_downward

Не пытаюсь украсть ответ Филипа, но я думаю, что для полного ответа на вопрос необходимо еще несколько деталей.

Даже когда WebView работает в полноэкранном режиме, AppBar пытается показать себя, когда вы щелкаете правой кнопкой мыши или проводите пальцем по экрану. Вы можете убедиться в этом, подписавшись на событие AppBar.Opened. Что интересно, так это то, что AppBar каким-то образом знает, что он скрыт, и автоматически закрывается. Даже если бы он не закрылся, вы не смогли бы его увидеть, потому что он скрыт под WebView.

У Филипа была правильная идея скрыть WebView и использовать WebViewBrush, когда AppBar открыт. Вы можете найти хороший пример этого здесь:

http://msdn.microsoft.com/en-us/library/windows/apps/windows.ui.xaml.controls.webviewbrush.aspx

Что касается переключения между WebView и WebViewBrush, я бы просто сделал это на AppBar.Opened и перевернул его на AppBar.Closed. AppBar легко закрывается, то есть, как только вы нажмете где-нибудь за пределами его клиентской области, он закроется.

И последний совет: во время моего тестирования казалось, что жест смахивания иногда проглатывается. Эта проблема, казалось, исчезла, когда я поместил границу в 1 пиксель сверху и снизу WebView. Ваш пробег может отличаться.

person Jared Bienz - MSFT    schedule 30.07.2012
comment
Это работает, когда пользователь щелкает правой кнопкой мыши, чтобы отобразить панель приложений? В моем приложении жест смахивания работает, но при использовании мыши панели приложений открываются и закрываются сразу - person MatthieuGD; 01.12.2012

arrow_upward
1
arrow_downward

Вам нужно скрыть WebView при отображении пользовательского интерфейса XAML поверх него и вместо этого использовать WebViewBrush.

person Filip Skakun    schedule 30.07.2012

arrow_upward
0
arrow_downward

Как было предложено выше, граница в 1 пиксель может помочь обеспечить соблюдение прокрутки сверху/снизу для AppBar. Однако, как и в случае с @matthieu, у меня все еще были проблемы с надежным открытием AppBar при использовании мыши и метода щелчка правой кнопкой мыши.

Проблема заключалась в том, что я включил элемент XAML как одноранговый для WebView, а не как родительский элемент ссылка MSDN для AppBar.Closed предлагает:

<Border BorderBrush="Gray" BorderThickness="2" Margin="100,20,100,20">
    <Grid>
        <WebView x:Name="contentView" Source="http://www.contoso.com"/>
        <Rectangle x:Name="contentViewRect"/>
    </Grid>
</Border>

Если я применяю границу таким образом, AppBar также надежно открывается с помощью мыши.

Последнее, на что следует обратить внимание, это то, что использование BorderBrush="Transparent" также работает нормально, поэтому вам не нужно на самом деле видеть уродливую границу. Мой окончательный XAML был примерно таким:

<Border BorderThickness="0,1,0,1" BorderBrush="Transparent">
    <Grid>
        <WebView x:Name="WebView"></WebView>
        <Rectangle x:Name="RectWebViewBrush"></Rectangle>
    </Grid>
</Border>
person danhbear    schedule 16.07.2013