status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

doc(contributing.md): add pixel miss-alignment recommendation 

Follow up on the PR comment https://github.com/status-im/status-desktop/pull/5549#issuecomment-1099468321
This commit is contained in:
Stefan Dunca 2022-04-14 23:16:31 +02:00 committed by Michał Cieślak
parent 78a9231cc9
commit d203334c94
1 changed files with 10 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
ui/StatusQ/src/contributing.md
View File

@ -41,7 +41,7 @@ If it doesn't map to an existing one, use a base control like `Item`.
## QML well-behaved components checklist
### Sizing support
### Positioning and sizing
[Positioners and Layouts In QML](https://doc.qt.io/qt-6/qtquick-usecase-layouts.html)
@ -66,6 +66,15 @@ If it doesn't map to an existing one, use a base control like `Item`.
- [Item Positioners in QML](https://doc.qt.io/qt-5/qtquick-positioning-layouts.html)
- Don't mix hints with sizes, it will create binding loops
### Quality
Pixel miss-alignment for sensitive elements like icons and images with straight and thin lines can degrade the quality perceptibly.
Dividing sizes and coordinates are the usual root cause of pixel miss-alignment. Correct subpixel division by rounding the result of the operation to a fixed value, e.g. `x: (width/2).toFixed()`
- Example of pixel miss-alignment. The right control has a position offset of `Qt.pos(0.7, 0.4)` therefore, the image interpolation generates a blurred rendering.
- ![](https://user-images.githubusercontent.com/47554641/163448378-3a6ede2f-a922-4f35-bff7-93c6bfa840d5.png)
## Topics
### QML Coding Conventions