Craig Oates
5 years ago
3 changed files with 111 additions and 0 deletions
@ -0,0 +1,109 @@
|
||||
Within `Domain` is a module called `DomainTypes`. (This is what is actually set to "auto-open".) In `DomainTypes`, you will find three types which are; |
||||
|
||||
1. `OverlayType` |
||||
2. `OverlaySpec` |
||||
3. `ImageSpec` |
||||
|
||||
Together they describe how your placeholder image will look. |
||||
|
||||
To help you become more familiar with them, it might help if you think of them like Matryoshka Dolls (I.E. "Russian Dolls"). The reason why is because of how the types interact with each other. The `ImageSpec` holds an `OverlaySpec` which holds an `OverlayType`. Granted, this is a high level overview but this relationship is an important part of knowing how to use SmoulderingBeachBall (S.B.B.) |
||||
|
||||
IMAGE OF THE RUSSIAN DOLL RELATIONSHIP |
||||
|
||||
Having said the above, you can circumvent all this by setting the "overlay" property to "None" when creating your `ImageSpec`. For example, take a look at the following piece of code; |
||||
|
||||
```f# |
||||
let spec = |
||||
{ width = 500 |
||||
height = 500 |
||||
colour = Brushes.Red |
||||
filePath = "your/file/path/here" |
||||
overlay = None // The important part of the example.} |
||||
spec |
||||
``` |
||||
|
||||
It is, also, worth pointing out you do not need to specify the file name (A.K.A. the "final part") of the `filePath`. This is because S.B.B. does it for you. Instead, you only need to specify the folder/place you want the image written to. (Perhaps "directory" might have been a better choice.) |
||||
|
||||
If you would like to read the actual source code in `DomainTypes`, you can do so by using the following link; |
||||
|
||||
- ["Domain.fs"](https://gitlab.com/craig.oates/Smouldering-Beach-Ball/blob/master/SmoulderingBeachBall/Domain.fs) |
||||
|
||||
## Domain Types Breakdown |
||||
|
||||
The following examples (amongst others) are viewable in "Snippets". You can get to "Snippets" using the following link; |
||||
|
||||
- [Snippets section](https://gitlab.com/craig.oates/Smouldering-Beach-Ball/snippets) |
||||
|
||||
### OverlayType |
||||
|
||||
This type describes what type of overlay you want on your placeholder image. `Border` adds a border around the sides of your image and `Full` adds an "X" across the image. The colour of "X" will be the same as the border. Here are some examples; |
||||
|
||||
IMAGE OF BORDER IMAGE |
||||
|
||||
IMAGE OF FULL IMAGE |
||||
|
||||
When it comes to creating an `OverlayType`, you tend to not make a "standalone" version. Instead, you will usually specify the type when you create an `OverlaySpec`. For example; |
||||
|
||||
```f# |
||||
// The definition of the type. |
||||
type OverlayType = |
||||
| Border |
||||
| Full |
||||
|
||||
// Creates a image with a black border and no "X". |
||||
let overlaySpecWithBorder = |
||||
{ colour = Brushes.Black |
||||
overlayType = Border} |
||||
|
||||
// Creates a image with a red border and an "X". |
||||
let overlaySpecWithFull = |
||||
{ colour = Brushes.Red |
||||
overlayType = Full } |
||||
``` |
||||
|
||||
### OverlaySpec |
||||
|
||||
Use this type to describe how you want the complete overlay to look. You will use this in conjunction with the `OverlayType`. You can use the above examples to help you get a grasp how to use/create `OverlaySpec`'s. With that said, here is how I defined `OverlaySpec`; |
||||
|
||||
```f# |
||||
type OverlaySpec = |
||||
{ colour: Brush; |
||||
overlayType: OverlayType } |
||||
``` |
||||
|
||||
### ImageSpec |
||||
|
||||
This type describes the whole image. Before you can use it, though, you must define the "overlay" (I.E. `OverlayType` and `OverlaySpec`). Although, you can circumvent that by using `None`. |
||||
|
||||
As an aside, you could create/define the "overlay" whilst creating the `ImageSpec`. But, I would argue against that. The reason why is because it makes it hard to read -- well it did when I was in the middle of writing S.B.B. |
||||
|
||||
Here are some examples of how you would create an `ImageSpec`; |
||||
```f# |
||||
// The definition of the type. |
||||
type ImageSpec = |
||||
{ width: int; |
||||
height: int; |
||||
colour: Brush; |
||||
filePath: string; |
||||
overlay: OverlaySpec option } |
||||
|
||||
// Image with no overlay. |
||||
let imageSpecWithNoOverlay = |
||||
{ width: 500 |
||||
height: 500 |
||||
colour: Brushes.Blue |
||||
filePath: "your/file/path/here" |
||||
overlay: None } |
||||
|
||||
// Image with a full overlay. |
||||
let oSpec = |
||||
{ colour = Brushes.Black |
||||
overlayType = Full } // You can change this to "Border". |
||||
|
||||
let spec = |
||||
{ width = 500 |
||||
height = 500 |
||||
colour = Brushes.AntiqueWhite |
||||
filePath = "your/file/path/here" |
||||
overlay = Some oSpec } |
||||
``` |
Loading…
Reference in new issue