需要帮助解析html代码,按顺序排序视图

时间:2017-07-27 06:01:15

标签: android parsing textview jsoup

我有一个html代码,放入一个我要解析的字符串,然后将其转换为不同的视图,并在Android中按顺序显示每个视图..

HTML示例:

String htmlText = " 
<div class = "quote">
<br>
<br>
Hello how are you today.
<p>
I am fine thank you.
<br>
<br>
<img src="http://testing.jpg"/>
<br>
<br>Lorem Ipsum is simply dummy text of the printing and typesetting industry. 
<br>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.
<br>
<img src="http://testing2.jpg"/>
</div>";

对于这种情况,我想在android中显示相应的图像视图和文本视图。但所有这一切都必须按升序排列。这很重要,因为每次内容都是动态的,图像可以在文本之前/之后等等。

我可以将内容转换为相应的视图,例如将文本设置为textview,这样就不会有问题。我的问题是如何解析HTML代码,以便按顺序显示内容?

我能想到的唯一方法是将html拆分成行,然后检查它是图像URL还是文本。然后我将使用Jsoup解析并放入相应的视图。

String[] parts = htmlText.split(System.getProperty("line.separator"));

for(int i = 0; i<parts.length;i++){

  if(parts[i].contains("<img src=\"")){
     Document doc = Jsoup.parse(parts[i]);
     String imgSrc = doc.getElementsByTag("img").attr("src");

     //function to convert imageUrl to imageView
     converttoImageView(imgSrc);
  }
  else{

     Document doc2 = Jsoup.parse(parts[i]);
     converttoTextView(doc2.text());
  }

}

private void converttoTextView(String text){


  View messageView = LayoutInflater.from(((PostViewHolder) holder).message_row.getContext()).inflate(R.layout.reply_message, ((PostViewHolder) holder).message_row, false);

  TextView message_textview = (TextView) messageView.findViewById(R.id.reply_message);
  message_textview.setText(text);


  ((PostViewHolder) holder).message_row.addView(messageView);

}

这个问题是,每个文本都是逐行分开的,一旦调用了函数,就会动态创建textview。我想使textview可选,因此用户可以复制和粘贴。但我无法选择整个文本。我只能按textview选择textview。

我收到的输出

<TextView> Hello how are you today</TextView>
<TextView> I am fine thank you </TextView>
<ImageView>testing.jpg</ImageView>
<TextView>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</TextView>
<TextView>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</TextView>
<ImageView>testing2.jpg</ImageView>

预期输出

<TextView> Hello how are you today \n\n I am fine thank you </TextView>
<ImageView>testing.jpg</ImageView>
<TextView>Lorem Ipsum is simply dummy text of the printing and typesetting industry.\nLorem Ipsum has been the industry's standard dummy text ever since the 1500s.</TextView>
<ImageView>testing2.jpg</ImageView>

2 个答案:

答案 0 :(得分:0)

我认为你可以编辑for循环,你可以记录文本,并在找到<img>时将其转换为TextView

如:

StringBuilder text = new StringBuilder();
for(int i = 0; i<parts.length;i++){
    if(parts[i].contains("<img src=\"")){
        if (!text.toString().equals("")) {
            //when find img, judge the text equals empty, if not, convert to TextView
            converttoTextView(text.toString());
            //clean the text after convert
            text.delete(0, text.length());
        }

        Document doc = Jsoup.parse(parts[i]);
        String imgSrc = doc.getElementsByTag("img").attr("src");

        //function to convert imageUrl to imageView
        converttoImageView(imgSrc);
    } else {
        Document doc2 = Jsoup.parse(parts[i]);
        //converttoTextView(doc2.text());

        //append the doc2 to text, but not execute convert method, just record
        text.append(doc2+"/n");
    }

}

if (!text.toString().equals("")) {
    //when find img, judge the text equals empty, if not, convert to TextView
    converttoTextView(text.toString());
    //clean the text after convert
    text.delete(0, text.length());
}

希望它能为您提供帮助,它只是基于您的代码的简单方法。

答案 1 :(得分:0)

您现在可能已经弄明白了,但是如果您仍在寻找解决方案,请查看此库https://github.com/square1-io/rich-text-android

特别是你可以解析你的HTML字符串:

      RichDocument document = RichTextV2.fromHtml(context,
                html, new RichTextV2.DefaultStyle(context) {
            @Override
            public boolean extractImages(){ // this will extract img tags from content
                return true;
            }
        });

然后您可以执行以下操作:

  for(DocumentElement element : document.getElements()){

        if(element instanceof RichTextDocumentElement){
            String content = ((RichTextDocumentElement)element).contentString();
            //set content to your TextView
        }
        if(element instanceof ImageDocumentElement){
            String imageUrl = ((ImageDocumentElement)element).getImageURL();
            //do whatever you want 
        }

    }