0

WPF デスクトップ アプリケーションがあります。その中に、ヘルプ ウィンドウを表示するメニュー オプションがあります。ヘルプ ウィンドウは、System.Windows.Controls.WebBrowser コントロールをラップするだけです。

これで、簡単な HTML ページを作成してヘルプ コンテンツを表示できるようになりました。これまでのところ、これはすべて正常に機能します。

この問題は、HTML ファイルに「img」タグを付けた会社のロゴなどの画像を含めようとすると発生します。ロゴは実行可能ファイルにリソースとして埋め込まれます。

HTLM ページに埋め込まれた画像を取得する方法を誰か教えてもらえますか?

以下は機能しません。

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <table style="width: 100%;">
        <tr>
            <td>&nbsp;
            </td>
            <td style="align-content:center">
                <img alt="My Logo" src="../Images/MyLogo_3115-2935.jpg" width="500"/>
            </td>
            <td>&nbsp;</td>
        </tr>
    </table>
</body>
</html>
4

2 に答える 2

1

user2509738 さんの返信に感謝しますが、別のファイルを展開する代わりに、埋め込まれた画像を使用したかったのです。私は独自の解決策を思いついたので、完全を期すためにここに投稿します。

解析を少し簡単にするために、 http: //htmlagilitypack.codeplex.com にある HtmlAgilityPack を使用しました。

ここに HelpWindow.Xaml があります

<Window x:Class="POC_WpfHelpWindowUsingHtml.HelpWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="HelpWindow" Height="600" Width="800">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition Height="50"/>
        </Grid.RowDefinitions>
        <WebBrowser x:Name="helpBrowser"/>
        <StackPanel x:Name="controlPanel"
                    Grid.Row="1"
                    Orientation="Horizontal"
                    HorizontalAlignment="Right">
            <Button x:Name="closeButton"
                    Margin="0,10,20,10" Width="100"
                    Content="Close"
                    Click="closeButton_Click"/>
        </StackPanel>
    </Grid>
</Window>

ファイル形式の HTML コンテンツは次のとおりです: HelpContent.html

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <table style="width: 100%;">
        <tr>
            <td>&nbsp;
            </td>
            <td style="align-content:center">
                <img id="imgMyLogo" alt="My Logo" src="Images/MyLogo.png" width="100"/>
            </td>
            <td>&nbsp;</td>
        </tr>
    </table>
</body>
</html>

これは、魔法のほとんどを含む HelpWindow.xaml.cs ファイルです。

using System;
using System.IO;
using System.Windows;
using HtmlAgilityPack;
using System.Reflection;

namespace POC_WpfHelpWindowUsingHtml
{
    /// <summary>
    /// Interaction logic for HelpWindow.xaml
    /// </summary>
    public partial class HelpWindow : Window
    {
        public HelpWindow()
        {
            InitializeComponent();
            Uri uri = new Uri(@"/HelpContent.html", UriKind.Relative);
            System.Windows.Resources.StreamResourceInfo info
                = System.Windows.Application.GetContentStream(uri);
            Stream streamOriginalPage = info.Stream;
            Stream streamModifiedPage = new MemoryStream();
            StreamWriter streamWriter = new StreamWriter(streamModifiedPage);

            // this is from HtmlAgilityPack
            HtmlDocument doc = new HtmlDocument();
            doc.Load(streamOriginalPage);
            // find all the img elements
            foreach (HtmlNode node in doc.DocumentNode.SelectNodes("//img"))
            {
                // change the image reference to an embedded string
                string src = node.GetAttributeValue("src", "");
                src = ConvertImageToEmbeddedString(src);
                if (!string.IsNullOrWhiteSpace(src))
                {
                    node.SetAttributeValue("src", src);
                }
            }
            // save the changes
            doc.Save(streamWriter);
            streamWriter.Flush();
            streamModifiedPage.Position = 0;

            // send the Html content to the WebBrowser component
            helpBrowser.NavigateToStream(streamModifiedPage);
        }

        private void closeButton_Click(object sender, RoutedEventArgs e)
        {
            this.Close();
        }

        private string ConvertImageToEmbeddedString(string source)
        {
            // find the image type
            string imageType = "png";
            if (source.ToLower().IndexOf("jpg") > -1) imageType = "jpg";
            if (source.ToLower().IndexOf("ico") > -1) imageType = "ico";
            // initialize the return value
            string ret = "";

            if (source.Length > 4)
            {
                if (!source.StartsWith("/"))
                {
                    source = "/" + source;
                }

                // get the embedded image as a stream
                Stream stream = Application.GetResourceStream(
                    new Uri("pack://application:,,," + source)).Stream;
                if (stream != null)
                {
                    // put the image into an Image object
                    System.Drawing.Image image = System.Drawing.Image.FromStream(stream);
                    if (image != null)
                    {
                        // prepend the text for Data URI scheme
                        ret = "data:image/" + imageType + ";base64,";
                        using (MemoryStream ms = new MemoryStream())
                        {
                            // convert the image into a MemoryStream
                            image.Save(ms, image.RawFormat);
                            // convert the image to base64 encoding
                            ret += Convert.ToBase64String(ms.ToArray());
                        }
                    }
                }
            }

            return ret;
        }
    }
}
于 2013-07-09T18:40:13.333 に答える
1

画像への絶対パスを指定すると機能します。たとえば、HTML

<img alt="My Logo" src="file:///C:/Images/MyLogo_3115-2935.jpg" width="500"/>

このソリューションは、アプリケーション リソースでは機能しません。少なくとも一時的に、リソースからローカルにファイルを作成する必要があります。または、アプリを使用してファイルをローカルにコピーします。

もう 1 つのより複雑な解決策は、Web サーバーをアプリケーションに埋め込むか、Web 要求に応答する別の場所に組み込むことです。詳細については、HttpListenerを参照してください。

于 2013-07-08T20:22:51.780 に答える