在移動應用程式中顯示存盤在JSON中的html標簽

我在 laravel 中開發了一個系統，其中我用 HTML 標簽存盤了一些資料。資料使用 WYSIWYG 插件存盤。（也在laravel中設計了API系統）。現在我想為此設計一個應用程式。我有 Java 的基本應用程式開發知識，但我想轉向混合應用程式，因此 react-native、kotlin 或 flutter 可能最適合。據我所知，react 所以我更喜歡 react-native。

所以基本的問題是他們是否支持在 App 上顯示 HTML 標簽。我在想的是，react-native 基本上是支持 HTML 的 react，但不知道。

我發現我可以通過以下鏈接使用 webView： Xamarin App 中的 Html 標簽

請指導我完成此操作。

正如我所提到的，我必須首先學習他們構建所需的應用程式，因此這個對于為此目的選擇正確的堆疊非常有幫助。

感謝您的時間和支持。

uj5u.com熱心網友回復：

Flutter 支持 HTML 渲染。請試試這個 Flutter 插件 https://pub.dev/packages/flutter_html/install flutter_html: ^0.11.1 它允許將 HTML 內容基本渲染到 Flutter 小部件樹中

Container(
          child: Html(
            padding: EdgeInsets.zero,
            data:
                "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <br><b> Turpis egestas integer eget aliquet nibh praesent tristique magna sit. Arcu odio ut sem nulla pharetra diam. Nulla porttitor massa id neque aliquam vestibulum morbi blandit cursus </b>. Commodo odio aenean sed adipiscing. Aliquet sagittis id consectetur purus ut faucibus pulvinar elementum. Sit amet dictum sit amet justo. Enim lobortis scelerisque fermentum dui faucibus. Tempus urna et pharetra pharetra massa massa ultricies. Neque egestas congue quisque egestas diam in arcu cursus. Potenti nullam ac tortor vitae.<br><i> Velit dignissim sodales ut eu sem. Imperdiet nulla malesuada pellentesque elit eget gravida cum sociis natoque. Amet commodo nulla facilisi nullam. In eu mi bibendum neque egestas congue quisque egestas. Egestas fringilla phasellus faucibus scelerisque. Dictum fusce ut placerat orci. Magna ac placerat vestibulum lectus mauris ultrices eros. Fames ac turpis egestas sed tempus.</i></p>",
            customTextAlign: (dom.Node node) {
              if (node is dom.Element) {
                switch (node.localName) {
                  case "p":
                    return TextAlign.left;
                }
              }
              return null;
            },
            customTextStyle: (dom.Node node, TextStyle baseStyle) {
              if (node is dom.Element) {
                switch (node.localName) {
                  case "p":
                    return baseStyle.merge(
                      TextStyle(
                        fontStyle: FontStyle.normal,
                        fontSize: 15.0,
                        fontWeight: FontWeight.normal,
                        color: Colors.black,
                      ),
                    );
                  case "b":
                    return baseStyle.merge(
                      TextStyle(
                        fontStyle: FontStyle.normal,
                        fontSize: 15,
                        fontWeight: FontWeight.bold,
                        color: Colors.black,
                      ),
                    );
                  case "i":
                    return baseStyle.merge(TextStyle(
                      fontStyle: FontStyle.italic,
                      fontSize: 15.0,
                      fontWeight: FontWeight.normal,
                      color: Colors.black,
                    ));
                }
              }
              return baseStyle;
            },
          ),
        ),
       

uj5u.com熱心網友回復：

您可以使用Html來顯示 HTML 內容。你應該實作Html.ImageGetter

Spanned spanned = Html.fromHtml(htmlContent, this, null);
textView.setText(spanned);

Html.ImageGetter是從 HTML 內容中加載影像。

@Override
public Drawable getDrawable(String source)

您可以在此處加載和顯示影像。

標籤：html 反应原生 扑 科特林 沙马林

上一篇：如何使用xamarian表單將工具列標題文本與左側對齊

下一篇：XamarinFormsIOS洗掉IconImageSource