mirror of
https://github.com/plantuml-stdlib/C4-PlantUML.git
synced 2022-10-18 01:14:54 +00:00
#186 LAYOUT_AS_SKETCH() styles can be set via SET_SKETCH_STYLE()
This commit is contained in:
@@ -29,6 +29,11 @@ rectangle C4VersionDetailsArea <<legendArea>> [
|
||||
!global $LEGEND_DARK_COLOR = "#66622E"
|
||||
!global $LEGEND_LIGHT_COLOR = "#khaki"
|
||||
|
||||
!global $SKETCH_BG_COLOR = "#EEEBDC"
|
||||
!global $SKETCH_FONT_COLOR = ""
|
||||
!global $SKETCH_WARNING_COLOR = "red"
|
||||
!global $SKETCH_FONT_NAME = "Comic Sans MS"
|
||||
|
||||
' Labels
|
||||
' ##################################
|
||||
|
||||
@@ -44,6 +49,9 @@ rectangle C4VersionDetailsArea <<legendArea>> [
|
||||
!global $LEGEND_DASHED_LINE = "(dashed) "
|
||||
!global $LEGEND_BOLD_LINE = "(bold) "
|
||||
|
||||
!global $SKETCH_FOOTER_WARNING = "Warning:"
|
||||
!global $SKETCH_FOOTER_TEXT = "Created for discussion, needs to be validated"
|
||||
|
||||
' Styling
|
||||
' ##################################
|
||||
|
||||
@@ -893,11 +901,42 @@ $getLegendTable()
|
||||
hide stereotype
|
||||
!endprocedure
|
||||
|
||||
!unquoted procedure SET_SKETCH_STYLE($bgColor="_dont_change_", $fontColor="_dont_change_", $warningColor="_dont_change_", $fontName="_dont_change_", $footerWarning="_dont_change_", $footerText="_dont_change_")
|
||||
!if $bgColor != "_dont_change_"
|
||||
!global $SKETCH_BG_COLOR = $bgColor
|
||||
!endif
|
||||
!if $fontColor != "_dont_change_"
|
||||
!global $SKETCH_FONT_COLOR = $fontColor
|
||||
!endif
|
||||
!if $warningColor != "_dont_change_"
|
||||
!global $SKETCH_WARNING_COLOR = $warningColor
|
||||
!endif
|
||||
!if $fontName != "_dont_change_"
|
||||
!global $SKETCH_FONT_NAME = $fontName
|
||||
!endif
|
||||
!if $footerWarning != "_dont_change_"
|
||||
!global $SKETCH_FOOTER_WARNING = $footerWarning
|
||||
!endif
|
||||
!if $footerText != "_dont_change_"
|
||||
!global $SKETCH_FOOTER_TEXT = $footerText
|
||||
!endif
|
||||
!endprocedure
|
||||
|
||||
!procedure LAYOUT_AS_SKETCH()
|
||||
skinparam backgroundColor #EEEBDC
|
||||
skinparam handwritten true
|
||||
skinparam defaultFontName "Comic Sans MS"
|
||||
center footer <font color=red>Warning:</font> Created for discussion, needs to be validated
|
||||
skinparam handwritten true
|
||||
!if $SKETCH_BG_COLOR > ""
|
||||
skinparam backgroundColor $SKETCH_BG_COLOR
|
||||
!endif
|
||||
!if $SKETCH_FONT_COLOR > ""
|
||||
skinparam defaultFontColor $SKETCH_FONT_COLOR
|
||||
!endif
|
||||
!if $SKETCH_FONT_NAMES > ""
|
||||
skinparam defaultFontName $SKETCH_FONT_NAME
|
||||
!endif
|
||||
!if $SKETCH_FOOTER_WARNING > "" || $SKETCH_FOOTER_TEXT > ""
|
||||
!$line = "footer <font color=" + $SKETCH_WARNING_COLOR + ">"+ $SKETCH_FOOTER_WARNING + "</font> " + $SKETCH_FOOTER_TEXT
|
||||
$line
|
||||
!endif
|
||||
!endprocedure
|
||||
|
||||
!global $fix_direction=%false()
|
||||
|
||||
+50
-1
@@ -192,7 +192,7 @@ Lay_Distance(LEGEND(), e, 1)
|
||||
|
||||

|
||||
|
||||
## LAYOUT_AS_SKETCH()
|
||||
## LAYOUT_AS_SKETCH() and SET_SKETCH_STYLE(?bgColor, ?fontColor, ?warningColor, ?fontName, ?footerWarning, ?footerText)
|
||||
|
||||
C4-PlantUML can be especially helpful during up-front design sessions.
|
||||
One thing which is often ignored is the fact, that these software architecture sketches are just sketches.
|
||||
@@ -225,6 +225,55 @@ Rel(web_app, twitter, "Gets tweets from", "HTTPS")
|
||||
|
||||

|
||||
|
||||
Additional styles and the footer text can be changed with SET_SKETCH_STYLE():
|
||||
|
||||
* `SET_SKETCH_STYLE(?bgColor, ?fontColor, ?warningColor, ?fontName, ?footerWarning, ?footerText)`:
|
||||
Enables the modification of differnt sketch styles and footer text.
|
||||
|
||||
The possible font name(s) depend on the output format (e.g. PNG uses fonts which are installed on the server and SVG fonts have to be installed on the client).
|
||||
Additional is it possible to define comma separated fall back fonts (if the diagrams are exported as SVG. Atm
|
||||
PNG does not support fallback fonts based on a PlantUML [bug](https://forum.plantuml.net/14842/specify-fall-back-fonts-is-not-working), but this could be fixed in one of the following versions)
|
||||
|
||||
```plantuml
|
||||
@startuml LAYOUT_AS_SKETCH Sample
|
||||
!include https://raw.githubusercontent.com/plantuml-stdlib/C4-PlantUML/master/C4_Container.puml
|
||||
|
||||
SET_SKETCH_STYLE($bgColor="lightblue", $fontColor="darkblue", $warningColor="darkred", $footerWarning="Sketch", $footerText="Created for discussion")
|
||||
|
||||
' PNG with font jlm_cmmi10 (typically another font is used)
|
||||
' SET_SKETCH_STYLE($fontName="jlm_cmmi10")
|
||||
|
||||
' SVG with fallback fonts MS Gothic,Comic Sans MS, Comic Sans, Chalkboard SE, Comic Neue, cursive, sans-serif (typically without "MS Gothic")
|
||||
SET_SKETCH_STYLE($fontName="MS Gothic,Comic Sans MS,Comic Sans,Chalkboard SE,Comic Neue,cursive,sans-serif")
|
||||
|
||||
LAYOUT_AS_SKETCH()
|
||||
|
||||
Person(admin, "Administrator")
|
||||
System_Boundary(c1, 'Sample') {
|
||||
Container(web_app, "Web Application", "C#, ASP.NET Core 2.1 MVC", "Allows users to compare multiple Twitter timelines")
|
||||
}
|
||||
System(twitter, "Twitter")
|
||||
|
||||
Rel(admin, web_app, "Uses", "HTTPS")
|
||||
Rel(web_app, twitter, "Gets tweets from", "HTTPS")
|
||||
@enduml
|
||||
```
|
||||
|
||||
PNG with font `jlm_cmmi10`
|
||||
|
||||

|
||||
|
||||
SVG with fallback fonts MS Gothic,Comic Sans MS,Comic Sans,Chalkboard SE,Comic Neue,cursive,sans-serif
|
||||
|
||||

|
||||
|
||||
All available (PNG) fonts can be displayed with
|
||||
|
||||
```plantuml
|
||||
@startuml
|
||||
listfonts
|
||||
@enduml
|
||||
```
|
||||
|
||||
## HIDE_STEREOTYPE()
|
||||
|
||||
|
||||
@@ -365,7 +365,7 @@ C4-PlantUML also comes with some layout options to make it easy and reusable to
|
||||
* [LAYOUT_TOP_DOWN() or LAYOUT_LEFT_RIGHT() or LAYOUT_LANDSCAPE()](LayoutOptions.md#layout_top_down-or-layout_left_right-or-layout_landscape)
|
||||
* [LAYOUT_WITH_LEGEND() or SHOW_LEGEND(?hideStereotype)](LayoutOptions.md#layout_with_legend-or-show_legend)
|
||||
* [SHOW_FLOATING_LEGEND(?alias, ?hideStereotype) and LEGEND()](LayoutOptions.md#show_floating_legendalias-hidestereotype-and-legend)
|
||||
* [LAYOUT_AS_SKETCH()](LayoutOptions.md#layout_as_sketch)
|
||||
* [LAYOUT_AS_SKETCH() and SET_SKETCH_STYLE(?bgColor, ?fontColor, ?warningColor, ?fontName, ?footerWarning, ?footerText)](LayoutOptions.md#layout_as_sketch)
|
||||
* [HIDE_STEREOTYPE()](LayoutOptions.md#hide_stereotype)
|
||||
|
||||
C4-PlantUML also comes with some person sprite/portrait options:
|
||||
@@ -691,7 +691,7 @@ C4-PlantUML also comes with some layout options to make it easy and reuseable to
|
||||
|
||||
* [LAYOUT_TOP_DOWN or LAYOUT_LEFT_RIGHT](LayoutOptions.md#layout_top_down-or-layout_left_right)
|
||||
* [LAYOUT_WITH_LEGEND](LayoutOptions.md#layout_with_legend)
|
||||
* [LAYOUT_AS_SKETCH](LayoutOptions.md#layout_as_sketch)
|
||||
* [LAYOUT_AS_SKETCH and SET_SKETCH_STYLE(?bgColor, ?fontColor, ?warningColor, ?fontName, ?footerWarning, ?footerText)](LayoutOptions.md#layout_as_sketch)
|
||||
|
||||
## Advanced Samples
|
||||
|
||||
|
||||
Reference in New Issue
Block a user