0

I'm used to working with HTML apps in which there is no problem of creating a list of components (like phonebook contact).

Example of my app

Now I have used this method in Windows Forms. One panel is populated with large number of custom UserControls (UC). Only 30 UserControls takes more than 5s to render. While the list of data from database is returnd in <1s.

This UC has only labels, PictureBox and Click event. It's called like this. This data is used to populate child controls.

new UserControl(MyModel data);

Is there a beter way of doing this? I would like to have user friendly GUI and not using Grid layout. It's not user friendly and very limited in terms of how data can be showed to user.

foreach (var data in myDbResult)
{
    var uc = new MyUserControl(data);
    uc.Dock = DockStyle.Top;
    resultFlowPanel.Controls.Add(uc);
}

...

public MyUserControl(MyModel data)
{
    this.data = data;
    InitializeComponent();
    label1.Text = data.name;
    label2.Text = data.address;
    // get some more data from database
    using (IDbConnection db = new SqlConnection(ConfigurationManager.ConnectionStrings["AlarmDbCon"].ConnectionString))
    {
        payer = db.Query<Models.g_UserPayer>("SELECT TOP(1) * FROM g_UserPayer WHERE ID_User=@UserID", new
        {
            UserID = guard.ID_User
        }).FirstOrDefault();
    }
    label3.Text = payer.email;
    PictureBox.Image = payer.image;
}
Matej Krhin
  • 47
  • 2
  • 11
  • Show the code, where you populate the UI. Why is Grid layout not user friendly and limited? C# is not HTML and Grid is not Table – Romano Zumbé Jul 14 '17 at 06:31
  • It it were up to me, I'd start by inheriting from `Control` and draw the control myself. It will be a lot more lightweight that creating a user control. – Matthew Layton Jul 14 '17 at 06:31
  • As fare as I know, Grid layout can only show data in table like view? It's not possible to create something like this [link](https://i.stack.imgur.com/RPf9z.png) – Matej Krhin Jul 14 '17 at 06:50

1 Answers1

0

If there are your own UI controls then you should consider using in your Load method the this.SuspendLayout(); and this.ResumeLayout(); methods to postpone the expensive UI layout calculation of the UI control.

Another aspect you can use is to load your expensive data on a Background Thread. To be able to do this you should use delegates to be able to update controls created on the UI Thread. More info on this on this SO answer.

Mihail Stancescu
  • 4,088
  • 1
  • 16
  • 21
  • I use standard UI controls like label, button... Suspend/Resume Layout is not helping. I have a tabControl, when i switch to tab with my large panel full of uc it also renders long time. – Matej Krhin Jul 14 '17 at 07:10
  • I saw that, but are wrapping/grouping them in a custom user control, right? – Mihail Stancescu Jul 14 '17 at 07:12
  • In that case try my methods above, if you don't see any significant improvement by using those two methods in the first paragraph, then you should use a Background Thread to populate the data along with those two methods. – Mihail Stancescu Jul 14 '17 at 07:15
  • Ok using Background Thread makes gui much more responsive. Thank you! I think in feature i will probaly use HTML for building apps like this it's much simpler and nicer to work with :) – Matej Krhin Jul 14 '17 at 08:15