---
title: "WebView vs SettingsFlyout"
description: "Сегодня я столкнулся с интересной проблемой, когда разрабатывалприложение для Windows 8. Есть WebV..."
author: "Stark"
published: "2013-05-06T03:52:12+00:00"
modified: "2013-05-06T03:52:12+00:00"
locale: "ru"
canonical_url: "https://yvision.kz/post/webview-vs-settingsflyout-351463"
markdown_url: "https://yvision.kz/post/webview-vs-settingsflyout-351463/markdown"
site_name: "Yvision.kz"
---

# WebView vs SettingsFlyout

> Сегодня я столкнулся с интересной проблемой, когда разрабатывалприложение для Windows 8. Есть WebV...

![WebView vs SettingsFlyout](http://storage.yvision.kz/images/user/stark/VdtW65kC2dcta8OY1I88k007KpCTiW.png)

Сегодня я столкнулся с интересной проблемой, когда разрабатывал приложение для Windows 8.

Есть WebView который отображает сайт и есть хедер с заголовком сайта и контролами для лайков, комментирования и шейринга представленных AppBarButton. Все просто правда?

Двигаемся дальше. Для комментирования я решил использовать Windows 8 Settings Panel.

Которая и вызывается при нажатии CommentButton. А тут, Тим Хейер создал очень удобный контрол
для создания-управления контролами и входящий в его Windows 8 Callisto library(который
распространяется через NuGet) назвав его SettingsFlyout.
Добавив немного своего кода я проверил на SF на жизнеспособность.

**И как всегда я ожидал такого результата:**

![WebView vs SettingsFlyout](http://storage.yvision.kz/images/user/stark/ZXJ6t05TRzbB6I00RhpZhFuchZxAjX.png)

**А получил вот такой:**

![WebView vs SettingsFlyout](http://storage.yvision.kz/images/user/stark/fHDLDv7gmj1czcbxDAXP2SjzV68mcm.png)

**Что же делать?**

Самый очевидный ответ это найти Тима, поговорить с Тимом и узнать у него очевидную вещь SF работает и вызывается. Что он мне наглядно показал. Значит проблема была в WebView. И в голову закралась первая мысль "а что если это из-за очередности появления WebView и SF. SF вызывается но его не видно так как WebView закрывает его полностью.

**Так как же исправить!?**

** **Слегка погуглив я нашел control который называется WebViewBrush и из официальных MSDN источников ознакомился с его предназначением.

> **WebView** has the characteristic that other UI regions such as controls cannot be rendered on top of the WebView. This is because of how window regions are handled internally, particularly how input events are processed and how the screen draws. If you want to render HTML content and also place other UI elements on top of that HTML content, you should use **WebViewBrush** as the render area. The WebView still provides the HTML source information, and you reference that WebView through element name binding and the SourceName property.WebViewBrush does not have this overlay limitation.

Самое смешное что мы не можем использовать WebViewBrush на прямую чтобы отобразить контент.

Документация гласила что: когда SF вызывается, мы должны "захватить" нынешний контент WebView в WebViewBrush и отобразить его через RectangleTool и следом прячя WebView. А когда SF закрывается вернуть обычный WebView.

Вот как то сдлеал я:

> private void RegisterForCommands(SettingsPane sender, SettingsPaneCommandsRequestedEventArgs args) { var feedsCommand = new SettingsCommand("manageFeedsCommand", "Manage Feeds", (feedCommand) => { // Создаем флайаут SettingsFlyout settings = new SettingsFlyout(); settings.Closed += (s, e) => { FeedItemWebView.Visibility = Windows.UI.Xaml.Visibility.Visible; FeedItemWebViewRect.Fill = new SolidColorBrush(Windows.UI.Colors.Transparent); }; settings.FlyoutWidth = SettingsFlyout.SettingsFlyoutWidth.Wide; settings.HeaderBrush = new SolidColorBrush(App.VisualElements.BackgroundColor); settings.HeaderText = "Manage Feeds"; BitmapImage bmp = new BitmapImage(App.VisualElements.SmallLogoUri); settings.SmallLogoImageSource = bmp; settings.Content = new SettingsContent(); // Прячем webView WebViewBrush b = new WebViewBrush(); b.SourceName = "FeedItemWebView"; b.Redraw(); FeedItemWebViewRect.Fill = b; FeedItemWebView.Visibility = Windows.UI.Xaml.Visibility.Collapsed; // Показываем панель settings.IsOpen = true; }); args.Request.ApplicationCommands.Add(feedsCommand); }

Итак, не самое лучше решение, но достаточно чтобы все работало как надо.

---

Source: [https://yvision.kz/post/webview-vs-settingsflyout-351463](https://yvision.kz/post/webview-vs-settingsflyout-351463)