antdui-demo/README-en.md

177 lines
5.7 KiB
Markdown
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<div align="center">
<img height="100" src="assets/logo.png">
<h1>AntdUI Demo</h1>
This project is developed based on `Winform .NET Framework 4.8`, and is a demo project of [AntdUI](https://gitee.com/antdui/AntdUI), the current version is `1.9.12`
</div>
English | <a href="README.md">中文</a>
## ✅ Quick Start
>1. Git clone or download the project directly
>2. Open this project using Visual Studio
>3. If .NET Framework 4.8 is not installed on your computer, edit the project file and set the TargetFramework property to the target framework you installed. Refer to [AntdUI compatible frameworks](https://www.nuget.org/packages/AntdUI#supportedframeworks-body-tab)
>4. Compile and run
## ⚠️ Precautions
- If the computer screen resolution is lower than 1920×1080 (1080P), please use a screen with a resolution greater than or equal to 1080P.
- If `TargetFramework` is set to `net6.0-windows7.0` or later, you can directly open the form interface and display the following prompt
![coredesign](assets/screenshots/coredesign-en.png)
- If the `TargetFramework` is set to `net48` or lower, and the computer screen resolution is greater than 1080P or the scaling is not at 100%, it is essential to open the project using one of the following methods. For detailed reasons, please refer to [Fix HDPI/scaling issues with Windows Forms Designer in Visual Studio](https://learn.microsoft.com/zh-cn/visualstudio/designers/disable-dpi-awareness?view=vs-2022)
1. Use the command `devenv /noScale` to start Visual Studio and click on `File - Open - Project/Solution`, as shown below.
![vsopen](assets/screenshots/vsopen-en.png)
2. Directly open the project, and when prompted on the window page, click **Restart Visual Studio with 100% scaling** as shown below.
![design](assets/screenshots/design-en.png)
## System Settings
- ✅ Support light/dark mode and automatically switch with the system
- ✅ Support enabling/disabling animation effects
- ✅ Support enabling/disabling shadow effects
- ✅ Support for displaying/hiding the scrollbar
- ✅ Support setting the message/notification display position
![SystemSet](assets/screenshots/Demo-en.png)
![SystemSet](assets/screenshots/Dark-en.png)
![SystemSet](assets/screenshots/SystemSet-en.png)
## Control Demo
### General
#### Button
![Button](assets/screenshots/Button-en.png)
#### FloatButton
![FloatButton](assets/screenshots/FloatButton-en.png)
#### Icon
![Icon](assets/screenshots/Icon-en.png)
### Layout
#### Divider
![Divider](assets/screenshots/Divider-en.png)
#### FlowPanel
![FlowPanel](assets/screenshots/FlowPanel.png)
#### GridPanel
![GridPanel](assets/screenshots/GridPanel.png)
#### Panel
![Panel](assets/screenshots/Panel.png)
#### Splitter
![Splitter](assets/screenshots/Splitter.png)
#### StackPanel
![StackPanel](assets/screenshots/StackPanel.png)
### Navigation
#### Breadcrumb
![Breadcrumb](assets/screenshots/Breadcrumb.png)
#### Dropdown
![Dropdown](assets/screenshots/Dropdown.png)
#### Menu
![Menu](assets/screenshots/Menu.png)
#### Pagination
![Pagination](assets/screenshots/Pagination.png)
#### Steps
![Steps](assets/screenshots/Steps.png)
### Data Entry
#### Checkbox
![Checkbox](assets/screenshots/Checkbox.png)
#### ColorPicker
![ColorPicker](assets/screenshots/ColorPicker.png)
#### DatePicker
![DatePicker](assets/screenshots/DatePicker.png)
#### DatePickerRange
![DatePickerRange](assets/screenshots/DatePickerRange.png)
#### Input
![Input](assets/screenshots/Input.png)
#### InputNumber
![InputNumber](assets/screenshots/InputNumber.png)
#### Radio
![Radio](assets/screenshots/Radio.png)
#### Rate
![Rate](assets/screenshots/Rate.png)
#### Select
![Select](assets/screenshots/Select.png)
#### SelectMultiple
![SelectMultiple](assets/screenshots/SelectMultiple.png)
#### Slider
![Slider](assets/screenshots/Slider.png)
#### SliderRange
![SliderRange](assets/screenshots/SliderRange.png)
#### Switch
![Switch](assets/screenshots/Switch.png)
#### TimePicker
![TimePicker](assets/screenshots/TimePicker.png)
#### UploadDragger
![UploadDragger](assets/screenshots/UploadDragger.png)
### Data Display
#### Avatar
![Avatar](assets/screenshots/Avatar.png)
#### Badge
![Badge](assets/screenshots/Badge.png)
#### Calendar
![Calendar](assets/screenshots/Calendar.png)
#### Carousel
![Carousel](assets/screenshots/Carousel.png)
#### Collapse
![Collapse](assets/screenshots/Collapse.png)
#### Label
![Label](assets/screenshots/Label.png)
#### LabelTime
![Label](assets/screenshots/LabelTime.png)
#### Popover
![Popover](assets/screenshots/Popover.png)
#### Preview
![Preview](assets/screenshots/Preview.png)
#### Segmented
![Segmented](assets/screenshots/Segmented.png)
#### Table
![Table](assets/screenshots/Table.png)
#### Tabs
![Tabs](assets/screenshots/Tabs.png)
#### Tag
![Tag](assets/screenshots/Tag.png)
#### Timeline
![Timeline](assets/screenshots/Timeline.png)
#### Tooltip
![Tooltip](assets/screenshots/Tooltip.png)
#### Tour
![Tour](assets/screenshots/Tour.png)
#### Tree
![Tree](assets/screenshots/Tree.png)
### Feedback
#### Alert
![Alert](assets/screenshots/Alert.png)
#### Drawer
![Drawer](assets/screenshots/Drawer.png)
#### Message
![Message](assets/screenshots/Message.png)
#### Modal
![Modal](assets/screenshots/Modal.png)
#### Notification
![Notification](assets/screenshots/Notification.png)
#### Progress
![Progress](assets/screenshots/Progress.png)
#### Spin
![Spin](assets/screenshots/Spin.png)
### Chat
#### ChatList
![ChatList](assets/screenshots/ChatList.png)
#### MsgList
![MsgList](assets/screenshots/MsgList.png)
### Other
#### Battery
![Battery](assets/screenshots/Battery.png)
#### ContextMenuStrip
![ContextMenuStrip](assets/screenshots/ContextMenuStrip.png)
#### Image3D
![Image3D](assets/screenshots/Image3D.png)
#### PageHeader
![PageHeader](assets/screenshots/PageHeader.png)
#### Signal
![Signal](assets/screenshots/Signal.png)