ListView与WebView单元格无法正确呈现

时间:2016-08-03 12:42:37

标签: listview webview xamarin.forms

我正在尝试使用ListView控件,该控件使用包含ItemTemplate的{​​{1}}。页面将加载一组聊天气泡(聊天气泡的内容为HTML)。

现在所有代码都运行正常,但渲染有点偏。

问题1。 如果我不添加WebView,则所有单元格将在彼此之下呈现。与重新计算细胞高度有关。 有什么方法可以摆脱这个吗?

问题2。 当加载所有聊天气泡并且总内容的高度大于屏幕时,Task.Delay仍然不会滚动...使用触摸操作ListView,它通常会重绘并且在那里点滚动就可以了。

所有这些感觉就像我需要等待所有渲染完成然后以某种方式重绘页面。 有人试过这样做吗?

这里有一些项目代码,如果需要我可以发布更多

的ListView:

ListView

加载数据:

<ListView x:Name="ChatListView"
          ItemsSource="{Binding Chats}"
          HasUnevenRows="true">
    <ListView.Margin>
        <OnPlatform x:TypeArguments="Thickness" iOS="0,30,0,0" />
    </ListView.Margin>      
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <StackLayout>
                    <WebView Source="{Binding Content, Converter={StaticResource HTMLConverter}}" HeightRequest="10" />
                </StackLayout>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

自定义iOS WebView渲染器:

public void LoadData()
{
    ChatMessage chatUser = new ChatMessage()
    {
        Name = "Glenn Versweyveld",
        Date = DateTime.Now,
        Subject = "Onvoldoende beschikbaar",
        Content = @"<dl><dt>Definition list</dt><dd>Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</dd><dt>Lorem ipsum dolor sit amet</dt><dd>Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</dd></dl>"
    };

    ChatMessage chatServer = new ChatMessage()
    {
        Name = "HelpDesk",
        Date = DateTime.Now,
        Subject = "Onvoldoende beschikbaar",
        Content = @"<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p>"
    };

    ChatMessage chatUser2 = new ChatMessage()
    {
        Name = "Glenn Versweyveld",
        Date = DateTime.Now,
        Subject = "Onvoldoende beschikbaar",
        Content = @"<h1>HTML Ipsum Presents</h1><p><strong>Pellentesque habitant morbi tristique</strong> senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. <em>Aenean ultricies mi vitae est.</em> Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, <code>commodo vitae</code>, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. <a href=""#"">Donec non enim</a> in turpis pulvinar facilisis. Ut felis.</p><h2>Header Level 2</h2><ol><li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li><li>Aliquam tincidunt mauris eu risus.</li></ol><blockquote><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.</p></blockquote><h3>Header Level 3</h3><ul><li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li><li>Aliquam tincidunt mauris eu risus.</li></ul><pre><code>#header h1 a { display: block; width: 300px; height: 80px; }</code></pre>"
    };

    Device.BeginInvokeOnMainThread(async () =>
    {
        Chats.Add(chatUser);
        await Task.Delay(50);
        Chats.Add(chatServer);
        await Task.Delay(50);
        Chats.Add(chatUser2);
        await Task.Delay(50);
    });
}

0 个答案:

没有答案