Item row height not adjusting in with multiline items
Hi,
I am encountering an issue and I can't figure out what's wrong. I have a list view, and according to the examples on your site, it should adjust the height of the rows automatically to fit the content. However, this is not happening.
Here is an image of the issue, and below, I am including the code with the problem.
Please let me know what is missing. Thanks.
Cristobal Sc
@using Syncfusion.Blazor.Lists
<SfListView DataSource="@_messages" Height="500px" Width="350">
<ListViewFieldSettings TValue="ChatMessage" Id="Sender" Text="Message"/>
<ListViewTemplates TValue="ChatMessage">
<Template>
<div class="e-list-wrapper e-list-multi-line e-list-avatar">
<span class="e-avatar e-avatar-circle">PP</span>
<span class="e-list-item-header">@context.Sender</span>
<span class="e-list-content">@context.Message</span>
</div>
</Template>
</ListViewTemplates>
</SfListView>
@code
{
public class ChatMessage
{
public string Sender { get; set; }
public string Recipient { get; set; }
public string Message { get; set; }
public DateTime SentTime { get; set; } = DateTime.Now;
}
private List<ChatMessage> _messages = new List<ChatMessage>();
private string _newMessage = "";
protected override async Task OnInitializedAsync()
{
_messages =
[
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
},
new ChatMessage()
{
Sender = "Peter Parker", SentTime = DateTime.Now,
Message = "This is the message sent via email and chat. We expect a long message to fie nicely",
Recipient = "Peter Smith"
}
];
await base.OnInitializedAsync();
}
private async Task SendMessage()
{
if (string.IsNullOrEmpty(_newMessage))
{
return;
}
// Replace with your logic to send message (e.g., SignalR)
var message = new ChatMessage
{
Sender = "Current User", // Replace with actual user
Recipient = "Recipient Name", // Replace with recipient
Message = _newMessage
};
_messages.Add(message);
_newMessage = "";
// Update UI (optional, SfList handles data changes)
// StateHasChanged();
// Scroll to the latest message
//await messageList.ScrollToIndex(_messages.Count - 1);
}
}
SIGN IN To post a reply.
3 Replies
SIGN IN To post a reply.
