kscience/visionforge
8
1
Fork 1
Code Issues Pull Requests Packages Projects Releases 3 Wiki Activity

Added one more image, supplemented inheritance doc

Browse Source
This commit is contained in:
kiruma524 2021-08-16 23:33:32 +03:00
parent 7b99ec54d2
commit d361d42c29
2 changed files with 32 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
docs/images/inheritance-properties.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 52 KiB

35
docs/inheritance
View File

@ -1,8 +1,8 @@
## Inheritance ## Inheritance
Inheritance is an ability of an element to transfer a pack of propereties to its `children` elements 'wrapped inside'. Inheritance is an ability of an element to transfer a pack of properties to its `children` elements 'wrapped inside'.
Properties have to be set in specific order: Properties have to be set in a specific order:
### Main properties' inheritance: ### Main properties' inheritance:
* styles * styles
* parents * parents
@ -16,18 +16,45 @@ As for `prototypes`, this property has to be set after styles, but before parent
* parents * parents
* parent's styles * parent's styles
* defaults * defaults
------------------------ ------------------------
Let's take a closer look using a [Muon Monitor Visualization](demo/muon-monitor/README.md). Let's take a closer look using a [Muon Monitor Visualization](demo/muon-monitor/README.md).
Running the demo, we will see this: Running the demo, we will see this:
![](../docs/images/inheritance-1.png) ![](../docs/images/inheritance-1.png)
You can see a tree of elements on the left; 'World' is a `root`, 'bottom', 'middle', and 'top' are 'World's `children` and so on.
![](../docs/images/inheritance-tree.png) ![](../docs/images/inheritance-tree.png)
On the right, there is a list with changeable properties.
![](../docs/images/inheritance-properties.png)
Properties, which can or cannot be inherited, are these:
* `visible` - toggles the visibility of an element. To be exact, the invisibility of an element is inheritable.
If a `parent` element is invisible, other elements are invisible as well, and they cannot be changed to visible mode.
![](../docs/images/inheritance-2-1-1.png) ![](../docs/images/inheritance-2-1-1.png)
![](../docs/images/inheritance-2-1-2.png) ![](../docs/images/inheritance-2-1-2.png)
* `material` - a group of properties, which can be inherited and which can be changed in `children` elements.
* `color` - color of an element.
Let's see how elements of the `material` group inherits changing `color` property; other properties of the same group inherits in the same way.
Let's change color of 'World' element.
![](../docs/images/inheritance-2-2-1.png) ![](../docs/images/inheritance-2-2-1.png)
It is a `parent`, so 'bottom', 'middle', and 'top' elements inherit this color.
Now, let's change 'top's color.
![](../docs/images/inheritance-2-2-2.png) ![](../docs/images/inheritance-2-2-2.png)
It changes only, 'bottom' and 'middle' stays the same.
'top' is a `parent` element as well: it has `children` - 'SC72', 'SC73', ... ,'SC80'. Let's change the color of 'SC76'.
![](../docs/images/inheritance-2-2-3.png) ![](../docs/images/inheritance-2-2-3.png)
![](../docs/images/inheritance-2-2-4.png) ![](../docs/images/inheritance-2-2-4.png)
![](../docs/images/inheritance-2-2-5.png) ![](../docs/images/inheritance-2-2-5.png)
* `opacity` - a number from 0 to 1 which represents percents of opacity (0 for 0%, 1 for 100%).
* `wireframe` - toggles the wireframe mode.
* `rotation` - rotation of an element. Here, it is set by `x` value. It is inheritable and unable to be changed in `children` elements.
* `position` - position of an element, cannot be inherited.