JSON 作为 Flex 中的 HTML 数据 - 超链接翻转

Posted 2023-03-05

【中文标题】JSON 作为 Flex 中的 HTML 数据 - 超链接翻转

【英文标题】：JSON as HTML data in Flex - Hyperlink Rollovers

【发布时间】：2011-01-18 09:05:46

【问题描述】：

我在 Flex 中使用 JSON 来解析带有自定义 html 标签的 HTML 数据。 Flex 对 HTML 的支持非常少，所以我想知道是否可以对这些链接进行简单的字体颜色更改翻转效果。目前我发现Flex只支持几个HTML标签，但通过Flex的whack CSS方法也支持CSS。

我可以通过外部 CSS 文件来操作在我的 JSON 文件中编写的 HTML 吗？还是在 JSON 文件中使用简单的标签更好？

【参考方案1】：

我不经常使用 Flex 没有太多深入的框架知识，但我想我 需要类似的东西：

做一个简单的字体颜色变化翻转 效果

这是一个sn-p：

var linkRegEx:RegExp = new RegExp("(https?://)?(www\\.)?([a-zA-Z0-9_%]*)\\b\\.[a-z]2,4(\\.[a-z]2)?((/[a-zA-Z0-9_%]*)+)?(\\.[a-z]*)?(:\\d1,5)?","g");
var link:String = 'generic links: www.google.com http://www.yahoo.com  ***.com';
link = addLinks(linkRegEx,link);
textField.htmlText = link;//textField is a TextField I have on stage

function addLinks(pattern:RegExp,text:String):String
    var result = '';
    while(pattern.test(text)) result = text.replace(pattern, "<font color=\"#0000dd\"><a href=\"$&\">$&</a></font>");
    if(result == '') result+= text;//if there was nothing to replace
    return result;

我只是使用了内联字体标签，css 可能会更好。这是我的original question。

HTH, 乔治

【参考方案2】：

简短回答：我认为这没有灵丹妙药。会很痛苦的。

您可以首先以添加静态 StyleSheet 属性的方式扩展 Text 类（例如 styleSheet:StyleSheet = null）。然后创建一个数组，其中包含以下样式，Flex 唯一支持的样式：

listOfStyles:Array = ['fontSize', 'color', 'fontWeight', 'fontFamily', 'fontStyle', 'textDecoration'];

然后你必须初始化 StyleManager.selectors，创建一个你将要使用的选择器数组。基本上，您会找到“A”标签并将上面的 listOfStyles 添加到其中，然后为每个样式创建一个新的 CSSStyleDeclaration。

这将允许您将上述样式应用于扩展类的 htmlText 属性。到目前为止，一切都很好。这使您能够在加载时使用外部样式表为锚标记设置不同的样式。然而，要应用翻转效果，即每个链接在 HTML 中翻转时改变颜色，将是有问题的，因为 MouseEvent.MOUSE_OVER 将应用于整个类，而不是其中的单个 HTML 元素。您必须弄清楚鼠标是否位于该 HTML 文本中的锚点上（并非不可能，但我现在没有时间解决这个问题）并在其中更改您的选择器。这将涉及获取文本范围，这总是意味着大量的工作。当客户希望表情符号出现在文本流中时，我不得不处理这个问题（Flex 的 HTML 实现无法支持的其他内容），而且非常粗糙。

我相信 Flex 4 会为这种东西添加更多原生支持，但我还没有专门研究过。

对不起，我没有灵丹妙药给你，但我希望这能对这个话题有所启发。

【讨论】：

非常感谢。这让我对去哪里有了一个基本的了解，但我需要弄清楚如何通过 JSON 文件传递​​ CSSStyleDeclaration。我很感激这个答案。现在我至少有一些东西可以开始了。干杯