QML Neumorphism (soft UI) QtQuick style.

Start developing Neumorphic QtQuick applications using Neumorphism UI.
The Neumorphic design concept has been applied to all of the components.

Also I used custom ShaderEffect for drop shadows, so there may be a few computational errors.

What is Neumorphism?

Medium

Neumorphism (or Neo-skeuomorphism) is a modern iteration of a style of designing web elements, frames, screens, etc. known as Skeuomorphism.

Preview

 

How to use

Warning
This components have only been tested on Qt version 5.15.2 and Windows OS at 3840x2160 resolution with a scaling factor of 250 percent; USAGE OF THIS COMPONENTS CARRIES NO WARRANTY.
 

Usage

Clone

Clone the repository first.

git clone https://github.com/SMR76/qml-neumorphism.git

Makefile

• If you're using cmake:
  Add these to your CMakeLists file.

  include_directories('path/to/Neumorphism')
  file(GLOB_RECURSE Neumorphism_SOURCES path/to/Neumorphism/*.*)
  
  set(PROJECT_SOURCES
          main.cpp
          qml.qrc
          ${Neumorphism_SOURCES}
  )

• Or, if you're using qmake:
  Include Neumorphism.pri in your project. _{see example-1}

  include('path/to/Neumorphism.pri')

Engine path

Add qrc:/ to the engine import path. _{see example-1}

engine.addImportPath("qrc:/");

Import

And finally import the Neumorphism module. _{see example-1}

import Neumorphism 1.2

If you are confused, please refer to Example-1 for a clearer understanding of what you should do.

Components

• Button
• Radio Button
• CheckBox
• Slider
• TextArea
• TextField
• ProgressBar
• RadioButton
• Switch
• RangeSlider
• SpinBox
• Tumbler
• Dial
• BusyIndicator
• SplitView
• StackView
• ComboBox

---

• HorizontalSeparator
• Custom Neumorphic shape

Issues

Please file an issue on issues page if you have any problems.

Documentation

no document provided yet.