angular / angular/components

bug(material/slide-toggle): Animation duration in M3 should be 300ms

Đang mở
#28,916 1 bình luận 2 reaction 0 người được giao Xem trên GitHub
area: material/slide-toggle M3 P3
Ngôn ngữ chính
TypeScript
Star
25k
Fork
6.8k
Merge trung bình
1 ngày 8 giờ
Pull request đã merge (30 ngày)
91

Mô tả

### Is this a regression?

- [ ] Yes, this behavior used to work in the previous version

### The previous version in which this bug was not present was

_No response_

### Description

The Slide toggle animation with an M3 theme uses the same duration and timing function as the M2 slide toggle. For the M3 switch this looks jarring and unfitting.

### Reproduction

StackBlitz link: https://stackblitz.com/edit/stackblitz-starters-andwku?file=src%2Fmain.ts
Steps to reproduce:
1. Look at the toggle animation
2. Compare with the toggle animation used in Material Web: https://material-web.dev/components/switch/stories/

### Expected Behavior

The slide toggle animation should not be jarring when using an M3 theme.

### Actual Behavior

The slide toggle animation uses the short animation duration from M2 and appears jarring.

### Environment

- Angular: 17.3.5
- CDK/Material: 17.3.5

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Hướng nghiên cứu

Bắt đầu với bản tái hiện StackBlitz được liên kết tại src/main.ts và so sánh hiệu ứng hoạt ảnh M3 slide-toggle với hành vi của Material Web switch. Theo dõi phần triển khai Angular Material slide-toggle để xác định thời lượng hoạt ảnh M3 và xác minh rằng hành vi hoàn chỉnh sử dụng thời lượng 300ms mà không có chuyển tiếp gây giật.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Đánh giá

Công nghệ
angular, typescript
Lĩnh vực
frontend
Loại issue
Lỗi
Độ khó
3/5
Thời gian dự kiến
1-2 ngày
Mức độ hoạt động
Đình trệ
Độ rõ ràng
Khá rõ ràng
Mức phù hợp với người mới
35/100

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.