Xin chào các bạn, bài viết hôm nay mình sẽ tiếp tục hướng dẫn các bạn cách sử dụng Usercontrol và FlowLayoutPanel để tạo một danh sách list phim trên lập trình C#, Winform.

[C#] Create Custom List with UserControl and FlowlayoutPanel

Dưới đây là giao diện demo của ứng dụng:

Đầu tiên, mình sẽ tạo một User control với tên customelistitem.cs với giao diện như hình bên dưới:

Ở giao diện trên chúng ta sẽ thiết kế bao gồm 4 label để hiển thị thông tin: title, overview, release date, vote

và một PictureBox để hiển thị hình ảnh của bộ phim.

Source code customelistitem.cs:

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;

namespace CustomList_Flyoutpanel
{
    public partial class CustomListItem : UserControl
    {
        public CustomListItem()
        {
            InitializeComponent();
        }

        #region Properties
        private string _title;
        private string _overView;
        private double _vote;
        private string _url;
        private DateTime _releaseDate;


        [Category("Custom Props")]
        public string Title
        {
            get { return _title; }
            set { _title = value; lbl_title.Text = value; }
        }

       
        [Category("Custom Props")]
        public string OverView
        {
            get { return _overView; }
            set { _overView = value; lbl_overview.Text = value; }
        }

        
        [Category("Custom Props")]
        public double Vote
        {
            get { return _vote; }
            set { _vote = value; lbl_vote.Text = value.ToString(); }
        }

       
        [Category("Custom Props")]
        public string URL
        {
            get { return _url; }
            set { 
                _url = value;
                pic_movie.LoadAsync(value);
            
            }
        }

       
        [Category("Custom Prop")]
        public DateTime ReleaseDate
        {
            get { return _releaseDate; }
            set { _releaseDate = value; lbl_releaseDate.Text = value.ToString("dd/MM/yyyy"); }
        }



        #endregion

        private void CustomListItem_MouseLeave(object sender, EventArgs e)
        {
            this.BackColor = Color.White;
        }

        private void CustomListItem_MouseEnter(object sender, EventArgs e)
        {
            this.BackColor = Color.Silver;
        }
    }
}

Sau khi tạo xong, ở Form main các bạn sử dụng một control FlowLayoutPanel:

Source code FrmMain.cs:

using Newtonsoft.Json;
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.IO;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;

namespace CustomList_Flyoutpanel
{
    public partial class Form1 : Form
    {
        public List<Movie> listMovie;
        public Form1()
        {
            InitializeComponent();
        }

        private void Form1_Load(object sender, EventArgs e)
        {
          
            listMovie = new List<Movie>();
            var json = File.ReadAllText("movie.json");
            listMovie = JsonConvert.DeserializeObject<List<Movie>>(json);
           
          
            var listItems = new CustomListItem[30];
            flowLayoutPanel.Controls.Clear();
            int i = 0;
            var pic = new PictureBox();
            foreach (var movie in listMovie.Take(30))
            {
                listItems[i] = new CustomListItem();
                listItems[i].Title = movie.title;
                listItems[i].OverView = movie.overview;
                listItems[i].ReleaseDate = movie.release_date;
                listItems[i].Vote = movie.vote_average;
                
                var url = "https://image.tmdb.org/t/p/w200" + movie.poster_path;
                listItems[i].URL = url;
                flowLayoutPanel.Controls.Add(listItems[i]);
                i++;
            }
        }

      

        public class Movie
        {
            public double popularity { get; set; }
            public int vote_count { get; set; }
            public bool video { get; set; }
            public string poster_path { get; set; }
            public int id { get; set; }
            public bool adult { get; set; }
            public string backdrop_path { get; set; }
            public string original_language { get; set; }
            public string original_title { get; set; }
            public string title { get; set; }
            public double vote_average { get; set; }
            public string overview { get; set; }
            public DateTime release_date { get; set; }
        }
    }
}

Thanks for watching!

DOWNLOAD SOURCE