- [C#] Di chuyển và thay đổi kích thước Control Winform khi ứng dụng đang chạy
- [VB.NET] Chia sẻ source tạo sắp xếp đội hình bóng đá Line-ups đội bóng
- [C#] Hướng dẫn chỉnh sửa Text của label trực tiếp trên winform
- [C#] Hướng dẫn custom TextBox giống Ultraviewer trên Winform
- [C#] Show Modal Winform like Bootstrap
- [DATABASE] Thứ tự thực hiện mệnh đề truy vấn SELECT trong Sqlserver
- [C#] Hướng dẫn viết addin Excel Lấy hình ảnh từ URL internet vào Excel
- [DATABASE] TSQL view max length all column data trên table Sqlserver
- [DEVEXPRESS] Hướng dẫn sử dụng MailMerge kèm Hình ảnh trên Winform
- [DATABASE] Hướng dẫn truy vấn xem kích thước lưu trữ của từng bảng ghi Table trên sqlserver
- [C#] Hướng dẫn Fake Date Time sử dụng thư viện Harmony
- [DATABASE] Phân biệt câu lệnh DDL và DML trong sqlserver
- [C#] Hướng dẫn convert file mã HTML sang file Pdf trên winform
- [DEVEXPRESS] Tạo các loại mã vạch Barcode trực tiếp trên Devexpress Barcode API
- [DEVEXPRESS] Hướng dẫn custom Simple button thành Progressbar
- [DATABASE] Tách số và chữ từ chuỗi - hàm tối ưu hóa tách số và chữ trong Sqlserver
- [C#] Tìm kiếm gần đúng Full Text Search sử dụng thư viện Lucene.NET
- [C#] Chia sẻ tài liệu, sdk và source code máy chấm công dòng máy ZKTeco
- [C#] Memory Cache là gì, và sử dụng trong ứng dụng Winform
- [DATABASE] Khóa chính Primary Key trong Sqlserver
[C#] Hướng dẫn sử dụng Sprite Image hiển thị hình Gif Sticker Zalo
Xin chào các bạn bài viết hôm nay mình sẽ hướng dẫn các bạn cách sử dụng kỷ thuật Sprite Image C#, để hiển thị hình ảnh Sticker Zalo trên Winform.
[C#] Hướng dẫn sử dụng Sprite Image hiển thị ảnh Sticker Zalo
Sprite image là gì?
Image Sprites là cách gộp nhiều ảnh nền cần sử dụng vào một file hình duy nhất và sử dụng thuộc tính background-position trong CSS với 2 vị trí Left, Top để xác định vị trí thành phần ảnh cần làm nền, nhằm giảm tải Request (yêu cầu) đến Server, và giảm dung lượng file hình, tăng tốc độ tải trang, tiết kiệm tài nguyên hệ thống.
Kỹ thuật này thường được sử dụng trên web để tăng tốc độ tải trang, và sử dụng CSS để hiển thị, hình ảnh theo position x, y mà mình mong muốn.
Ví dụ: mình có hình mẫu sprite sticker của zalo như hình bên dưới:
Hoặc hình dưới đây:
Và bây giờ, mình sẽ viết một hàm Split()
để cắt 1 hình ảnh này thành nhiều hình ảnh và bỏ vào trong ImageList C#.
Sau đó, chúng ta sẽ sử dụng một Timer()
để thay đổi các hình lên pictureBox thì chúng ta sẽ có được hành động.
Tốc độ nhanh chậm của chuyển động, mình sẽ sử dụng công cụ Trackbar
để change delay giữa các hình ảnh qua Interval
của Timer.
Dưới đây là giao diện demo ứng dụng Sprite Image C#:
Source code C#:
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 SpriteImage
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
}
private ImageList Split(Bitmap image, int width, int height)
{
ImageList rows = new ImageList();
rows.ImageSize = new Size(width, height);
rows.Images.AddStrip(image);
ImageList cells = new ImageList();
cells.ImageSize = new Size(width, height);
foreach (Image row in rows.Images)
{
cells.Images.AddStrip(row);
}
return cells;
}
ImageList ListImage;
int count = 0;
int i = 0;
private void btn_sprite_Click(object sender, EventArgs e)
{
timer1.Stop();
i = 0;
var dlg = new OpenFileDialog();
if(dlg.ShowDialog() == DialogResult.OK)
{
var img = (Bitmap)Image.FromFile(dlg.FileName);
ListImage = Split(img, 130, 130);
count = ListImage.Images.Count;
timer1.Enabled = true;
timer1.Start();
}
}
private void pictureBox1_Paint(object sender, PaintEventArgs e)
{
}
private void timer1_Tick(object sender, EventArgs e)
{
pictureBox1.Image = ListImage.Images[i];
i++;
if (i == count) { i = 0; }
}
private void trackBar1_ValueChanged(object sender, EventArgs e)
{
timer1.Interval = trackBar1.Value;
}
private void Form1_Load(object sender, EventArgs e)
{
trackBar1.Value = timer1.Interval;
}
}
}
Thanks for watching!