Home

Lecture

c# (личная):

Practical application programming in C# in VS.NET 2008 environment
[+]
Created: 04.08.2010 | Level: specialist | Access: free
Самостоятельная работа 10:

Текст WPF
A
|
версия для печати
< Самостоятельная работа 9 || Самостоятельная работа 10: 123456789 || Самостоятельная работа 11 >

Упражнение 3. Работа в WPF с HTML-документами

Поскольку XAML -формат документов и сама технология WPF являются относительно новыми, может потребоваться применить WPF к уже наработанному большому массиву HTML -документов. Для этого в WPF имеется класс System.Windows.Controls.WebBrowser. Его не нужно путать с одноименным классом System.Windows.Forms.WebBrowser технологии Windows Forms. Описание WebBrowser приведено в

http://msdn.microsoft.com/ru-ru/library/system.windows.controls.webbrowser.aspx

В этом упражнении мы познакомимся с применением WebBrowser WPF к просмотру HTML -документов, а также с преобразованием HTML в рассмотренные ранее XAML -документы нефиксированного формата.

  • Добавьте к решению командой File/Add/New Project новый проект WpfText3 типа WPF Application и назначьте его стартовым

Просмотр HTML-документов в WebBrowser

  • В декларативный раздел XAML добавьте контейнер <TabControl> с вкладкой <TabItem Header="HTML1">
  • Заполните файл Window1.xaml следующим кодом
<Window x:Class="WpfText3.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" 
    Height="300" Width="300"
    Background="LightGray"
        >
    
    <TabControl>
        <TabItem Header="HTML1">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="*" />
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>
                <WebBrowser Grid.Row="0" Name="webBrowser1" />
                <StackPanel Grid.Row="1" Orientation="Horizontal" HorizontalAlignment="Center">
                    <Button Width="75" Content="Back" Click="backButton_Click" Margin="0,5,0,0" />
                    <Button Width="75" Content="Load" Click="loadButton_Click" Margin="5,5,5,0" />
                    <Button Width="75" Content="Forward" Click="forwardButton_Click" Margin="0,5,0,0" />
                </StackPanel>
            </Grid>  
        </TabItem>
    </TabControl>
</Window>
  • Обработчики события Click кнопок заполните так
using System;
using System.Collections.Generic;
using System.Text;
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 WpfText3
{
    public partial class Window1 : Window
    {
        public Window1()
        {
            InitializeComponent();
        }
    
        private void loadButton_Click(object sender, RoutedEventArgs e)
        {
            Microsoft.Win32.OpenFileDialog openFileDialog = new Microsoft.Win32.OpenFileDialog();
            openFileDialog.Filter = "HTML Documents (*.htm; *.html)|*.htm;*.html";
            openFileDialog.InitialDirectory = System.IO.Directory.GetCurrentDirectory();
            openFileDialog.Multiselect=false;
            if (openFileDialog.ShowDialog() == false || openFileDialog.FileName == String.Empty)
                return;
    
            Uri uri = new Uri(openFileDialog.FileName);
            this.webBrowser1.Source = uri;
        }
    
        private void backButton_Click(object sender, RoutedEventArgs e)
        {
            if (this.webBrowser1.CanGoBack)
            {
                this.webBrowser1.GoBack();
            }
        }
    
        private void forwardButton_Click(object sender, RoutedEventArgs e)
        {
            if (this.webBrowser1.CanGoForward)
            {
                this.webBrowser1.GoForward();
            }
        }
    }
}
  • Запустите проект - получится нормальный инструмент просмотра HTML -документов


Отображение HTML-текста в WebBrowser из файла

Обратите внимание, что в предыдущем примере автоматически появляются полосы прокрутки, если HTML -документ не помещается в окне элемента WebBrowser. Фрагмент форматированного HTML -текста включать прямо в WebBrowser нельзя, поскольку XAML -редактор оболочки сразу начнет ругаться. Но во время выполнения загружать файл из кода можно.

В данном примере мы заранее создадим HTML -файл с простым форматированным текстом.

  • В Solution Explorer вызовите контекстное меню для узла WpfText3 и командой Add/Existing Item добавьте к проекту файл HtmlDoc.htm из прилагаемого каталога Source (или создайте свой HTML -документ и добавьте его к проекту той же командой)

Содержимое файла будет примерно таким

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
 <title>Untitled Document</title>
 <!--
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
 -->
</head>
    
<body style="font-family:Arial, Helvetica, sans-serif">
<h2 align="center"><font color="#FF0000">Это небольшой фрагмент чистого HTML-текста</font></h2>
<ol>
  <li>Шрифт Arial</li>
  <li><font color="#0000FF">Цвет font color=&quot;#0000FF&quot;</font></li>
  <li><font face="Courier New">Шрифт Courier New </font></li>
  <li><b>Стиль полужирный &lt;b&gt; </b></li>
  <li><i>Стиль Italic  &lt;i&gt; </i></li>
</ol>
</body>
</html>
  • Выделите этот файл и в панели Properties настройте его свойства так
    • Build Action = None
    • Copy to Output Directory=Copy if newer
  • В декларативный раздел XAML в контейнер <TabControl> добавьте новую вкладку <TabItem Header="HTML2">
  • Заполните ее следующим скриптом
<TabItem Header="HTML2" Selector.IsSelected="True">
            <WebBrowser x:Name="webBrowser2" Initialized="webBrowser2_Initialized" />
        </TabItem>
  • Обработчик события Initialized заполните так
private void webBrowser2_Initialized(object sender, EventArgs e)
        {
            Uri uri = new Uri(System.IO.Directory.GetCurrentDirectory() +
                "\\HtmlDoc.htm", UriKind.Absolute);
    
            this.webBrowser2.Navigate(uri);
        }

Здесь мы применили несколько иной способ загрузки файла!

  • Запустите проект - получится примерно следующее


Вертикальную полосу прокрутки мне убрать в этом примере не удалось.

Отображение HTML-текста в WebBrowser из потока

Рассмотрим способ подключения HTML -текста из потока. В качестве источника текста будем использовать все тот же файл из предыдущего примера, полагая, что он будет находиться в одном каталоге со сборкой приложения в силу определенных нами ранее для него параметров.

  • В декларативный раздел XAML в контейнер <TabControl> добавьте новую вкладку <TabItem Header="HTML3">
  • Заполните ее следующим скриптом
<TabItem Header="HTML3" Selector.IsSelected="True">
            <WebBrowser x:Name="webBrowser3" Initialized="webBrowser3_Initialized" />
        </TabItem>
  • Обработчик события Initialized заполните так
private void webBrowser3_Initialized(object sender, EventArgs e)
        {
            Uri uri = new Uri("HtmlDoc.htm", UriKind.Relative);
            System.IO.Stream source = Application.GetRemoteStream(uri).Stream;
    
            this.webBrowser3.NavigateToStream(source);
        }
  • Запустите проект - получится то же самое, что в предыдущем примере


Еще один способ загрузки HTML-документа из потока

  • В декларативный раздел XAML в контейнер <TabControl> добавьте новую вкладку <TabItem Header="HTML4">
  • Заполните ее следующим скриптом
<TabItem Header="HTML4" Selector.IsSelected="True">
            <WebBrowser x:Name="webBrowser4" Initialized="webBrowser4_Initialized" />
        </TabItem>
  • Обработчик события Initialized заполните так
private void webBrowser4_Initialized(object sender, EventArgs e)
        {
            string path = System.IO.Directory.GetCurrentDirectory() + "\\HtmlDoc.htm";
            System.IO.StreamReader streamReader = new System.IO.StreamReader(
                path, Encoding.GetEncoding(1251));
            //MessageBox.Show(streamReader.CurrentEncoding.CodePage.ToString());
            string text = streamReader.ReadToEnd();
    
            webBrowser4.NavigateToString(text);
        }
Здесь мы задали номер кодовой страницы 1251  !!!
  • Обязательно закомментируйте или удалите HTML-дескриптор <meta> в документе HtmlDoc.htm, иначе будут проблемы с кодировкой "Кириллица (Windows) - 1251" в этом примере HTML4
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<!--
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
-->
</head>
    
<body style="font-family:Arial, Helvetica, sans-serif">
<h2 align="center"><font color="#FF0000">Это небольшой фрагмент чистого HTML-текста</font></h2>
<ol>
  <li>Шрифт Arial</li>
  <li><font color="#0000FF">Цвет font color=&quot;#0000FF&quot;</font></li>
  <li><font face="Courier New">Шрифт Courier New </font></li>
  <li><b>Стиль полужирный &lt;b&gt; </b></li>
  <li><i>Стиль Italic  &lt;i&gt; </i></li>
</ol>
</body>
</html>
  • Запустите проект - получится то же самое, что в предыдущем примере


Next >>
< Самостоятельная работа 9 || Самостоятельная работа 10: 123456789 || Самостоятельная работа 11 >