Các điều khiển tùy chỉnh rất phổ biến trong quá trình phát triển WPF. Đôi khi một số điều khiển cần phải phù hợp với doanh nghiệp hoặc làm đẹp phong cách thống nhất. Tại thời điểm này, một số sửa đổi đối với các điều khiển là cần thiết.

Không dài dòng nữa, chúng ta hãy nhìn vào kết quả.

Hiệu ứng mặc định: Hiệu ứng tải lên

Bộ nút bo tròn góc

Vì bản thân nút này không có thuộc tính CornerRadius nên bạn chỉ có thể ghi đè mẫu điều khiển của Nút.

Chỉ cần thêm Đường viền vào mẫu nút, nhưng bản thân nút đó không có thuộc tính CornerRadius nên không có cách nào để sử dụng Bản mẫu. Chúng tôi chỉ có thể viết theo kiểu, chắc chắn sẽ không hoạt động, vì vậy chúng tôi cần mở rộng. Nút nút.

1. Tạo một lớp MyProgressButton kế thừa lớp Button. Vì đây là lớp mới được tạo nên chúng ta có thể trực tiếp sử dụng thuộc tính phụ thuộc để hoàn thành vấn đề này.

                        
                          công khai CornerRadius CornerRadius { lấy { trả về (CornerRadius) GetValue (CornerRadiusProperty); } đặt { Đặt giá trị (CornerRadiusProperty, giá trị); } } công khai tĩnh chỉ đọc DependencyProperty CornerRadiusProperty = DependencyProperty.Register (tên của (CornerRadius), loại (CornerRadius), loại (MyProgressButton), PropertyMetadata mới (mặc định));

                        
                      

2. Tạo tệp tài nguyên ProgressButtonStyle.xaml và xác định một số kiểu cho MyProgressButton, bao gồm liên kết vòng cung và hiệu ứng đổ bóng khi chuột di chuyển vào và ra, để tạo nút ba chiều.

3. Cuối cùng, thêm điều khiển được đặt tên của MyProgressButton vào giao diện chính, sử dụng xaml để tạo nút MyProgressButton, tùy chỉnh một số thuộc tính và thêm kiểu ProgressButtonStyle.xaml vào App.xaml.

Xem hiệu ứng

Các định nghĩa liên quan đến tập tin tải lên nút

1. Xác định tiến trình tải lên tệp của loại nút MyProgressButton, có tải lên hay không và màu nền của nút trong khi tải lên.

                        
                          /// 
 /// Nội dung bài viết /// 
 public double Progress { get { return (double)GetValue(ProgressProperty); } set { SetValue(ProgressProperty, value); } } public static readonly DependencyProperty ProgressProperty = DependencyProperty.Register(nameof(Progress), typeof(double), typeof(MyProgressButton), new PropertyMetadata(double.NegativeZero, OnProgressChanged)); /// 
 /// Nội dung bài viết /// 
 public bool IsUploading { get { return (bool)GetValue(IsUploadingProperty); } set { SetValue(IsUploadingProperty, value); } } public static readonly DependencyProperty IsUploadingProperty = DependencyProperty.Register(nameof(IsUploading), typeof(bool), typeof(MyProgressButton), new PropertyMetadata(false, OnIsUploadingChanged)); /// 
 /// Không có thuộc tính nào /// 
 public Color UploadingColor { get { return (Color)GetValue(UploadingColorProperty); } set { SetValue(UploadingColorProperty, value); } } // Sử dụng DependencyProperty làm kho lưu trữ sao lưu cho UploadingColor. Điều này cho phép hoạt ảnh, kiểu dáng, liên kết, v.v... public static readonly DependencyProperty UploadingColorProperty = DependencyProperty.Register(nameof(UploadingColor), typeof(Color), typeof(MyProgressButton), new PropertyMetadata(Colors.White));

                        
                      

2. Làm thế nào để nhận biết hiển thị tiến trình bên trong nút? Có một số cách, chẳng hạn như sử dụng các màu lũy tiến để sửa đổi độ lệch hoặc đặt thanh tiến trình bên trong nút hoặc đặt hai khối điều khiển có màu khác nhau bên trong nút để tự động sửa đổi độ dài của cả hai. Chúng tôi chọn cái đầu tiên.

Khi thuộc tính Progress được sửa đổi, chúng tôi sẽ tự động sửa đổi độ lệch của màu lũy tiến bên trong nút. Thêm lệnh gọi lại để thay đổi giá trị cho ProgressProperty.

                        
                          void tĩnh riêng tư OnProgressChanged(DependencyObject d, DependencyPropertyChangedEventArgs e) { var btn = d as MyProgressButton; var Progress = (double)e.NewValue; if (progress != double.NegativeZero) { Brush Brush = null; .Nền là LinearGradientBrush) != null) // Nếu bản thân nút đó là một gradient tuyến tính, hãy sửa đổi phần bù trực tiếp { Bộ sưu tập gradientStopCollection = cọ.GetValue(GradientBrush.GradientStopsProperty) dưới dạng gradientStopCollection bộ sưu tập [1].Offset = bộ sưu tập [0].Offset = Progress / 100 } else / /Nếu nó không phải là màu gradient tuyến tính, hãy sửa đổi màu nền thành màu gradient tuyến tính { LinearGradientBrush LinearGradientBrush = new LinearGradientBrush(); //Thiết lập một đường ngang LinearGradientBrush.StartPoint = new Point(0, 0.5); LinearGradientBrush.EndPoint = new Point(1, 0.5); gradientStop gradientStop = new gradientStop(); , Tức là màu nền của nút được đặt khi tải lên gradientStop.Color = btn!.UploadingColor; gradientStop1 = new gradientStop();//Màu bên trái là màu gốc của nút gradientStop1.Color = (btn!.Background as SolidColorBrush)!.Color; gradientStop.Offset = gradientStop1.Offset = Progress / 100; .GradientStops Thêm (gradientStop1); tuyến tínhGradientBrush.GradientStops.Add(gradientStop); btn.Background = tuyến tínhGradientBrush;

                        
                      

Khi tải tệp lên, hãy tắt nút này để tránh nhấp chuột nhiều lần. Viết lệnh gọi lại khi giá trị của thuộc tính IsUploadingProperty thay đổi.

                        
                          private static void OnIsUploadingChanged(DependencyObject d, DependencyPropertyChangedEventArgs e) { var btn = d là MyProgressButton; nếu ((bool)e.NewValue) { btn!.IsEnabled = false; } nếu không { btn!.IsEnabled = true; } }

                        
                      

mã kiểm tra

                        
                          Liên kết liên kết = new Binding(); liên kết.Source = cái này; liên kết.Path = new PropertyPath("Progress"); liên kết.Mode = BindingMode.OneWay; upload_btn.SetBinding(MyProgressButton.ProgressProperty, binding); Liên kết liên kết1 = new Binding(); liên kết1.Source = cái này; liên kết1.Path = new PropertyPath("IsUploading"); liên kết1.Mode = BindingMode.OneWay; upload_btn.SetBinding(MyProgressButton.IsUploadingProperty, binding1);

                        
                      

                        
                          private async void upload_btn_Click(object sender, RoutedEventArgs e) { IsUploading = true; thử { sử dụng (FileStream fread = new FileStream("d://d3dcompiler_47.dll", FileMode.Open, FileAccess.Read)) sử dụng (FileStream fwrite = new FileStream("d://d3dcompiler_47_copy.dll", FileMode.OpenOrCreate, FileAccess.Write)) { var allLength = new FileInfo("d://d3dcompiler_47.dll").Length; long copyedBytes = 0; while (true) { var buffer = ArrayPool.Shared.Rent(1024 * 10); thử { var len = await fread.ReadAsync(buffer, 0, buffer.Length); if (len > 0) { await fwrite.WriteAsync(buffer[..len]); copyedBytes += len; Tiến trình = copyedBytes * 100 / allLength; chờ Task.Delay(20); } else { break; } } catch { break; } cuối cùng { ArrayPool.Shared.Return(buffer); } } MessageBox.Show("Không có nội dung nào"); }; } cuối cùng { IsUploading = false; } }

                        
                      

Cuối cùng, bài viết này về các điều khiển tùy chỉnh phải thành thạo trong WPF - Thực hành chiến đấu: Nút tiến trình hiển thị tệp tải lên tự tạo có ở đây. Nếu bạn muốn biết thêm về các điều khiển tùy chỉnh phải thành thạo trong WPF - Thực hành chiến đấu: Vui lòng. tìm kiếm bài viết CFSDN hoặc tiếp tục duyệt các bài viết liên quan để tìm nội dung nút tiến trình tải lên tệp tự tạo. Tôi hy vọng bạn sẽ ủng hộ blog của tôi trong tương lai! .