Difference between revisions of "Template:LCD"
m |
|||
| (3 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
| − | <includeonly> | + | <includeonly>{{#css:Template:LCD/style.css}}<div class="lcd-container" align="center" style="float: {{{float|none}}}; clear: {{{float|none}}};"> |
| − | {{#css: | + | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | }} | + | |
| − | <div class="lcd-container" align="center" style="float: {{{ | + | |
<table class="lcd-table" align="center" summary="MegaDrum display" style="background: {{{bgcolor|#00FF00}}};"> | <table class="lcd-table" align="center" summary="MegaDrum display" style="background: {{{bgcolor|#00FF00}}};"> | ||
<tr> | <tr> | ||
| − | <td class="lcd-row1" style="color: {{{color|#000000}}};">{{{line1|<MegaDrum.info >}}}</td> | + | <td class="lcd-row1 {{{contrast|}}}" style="color: {{{color|#000000}}};">{{{line1|<MegaDrum.info >}}}</td> |
</tr> | </tr> | ||
<tr> | <tr> | ||
| − | <td class="lcd-row2" style="color: {{{color|#000000}}};">{{{line2|(c)D.Skachkov }}}</td> | + | <td class="lcd-row2 {{{contrast|}}}" style="color: {{{color|#000000}}};">{{{line2|(c)D.Skachkov }}}</td> |
</tr> | </tr> | ||
</table> | </table> | ||
Latest revision as of 13:37, 2 August 2010
Documentation
This template is used to illustrate various MegaDrum settings that a user can observe on the LCD screen. Here's how it works in a nutshell: you write the following code:
{{LCD|
color=black|
bgcolor=#00FF00|
line1=<MegaDrum.info >|
line2=(c)D.Skachkov{{nbsp|2}}{{LCD/arrows|black}}|
caption=MegaDrum copyright screen and contrast adjust
}}
And get this result:
| <MegaDrum.info > |
(c)D.Skachkov  |
MegaDrum copyright screen and contrast adjust
As you can see, there is 2 lines, 16 characters in each. This mimics the type of LCD currently used with MegaDrum.
The format of the template is self-explanatory. Any parameter can be omitted. Defaults are: black characters on green background. The default text is the copyright screen and default caption is "MegaDrum display". Observe the main template to see how it looks.
A note on text formatting: Please note that if a line contains more than a single whitespace character you will need to use the Nbsp template. For example, let's say you need 5 consecutive space characters in a string. You would write this as:
{{nbsp|5}}
Please consult the documentation for more information.
Also consider using < for the "<" character and ">" for the ">" character.
Here's another example. Note that I used a different color/bgcolor here. You can also use standard RGB color representations such as #00FF00.
{{LCD|
color=white|
bgcolor=blue|
line1=█_______________|
line2=________________|
caption=MegaDrum VU Meter screen
}}
Result:
| █_______________ |
| ________________ |
MegaDrum VU Meter screen
Finally here is an example settings screen.
{{LCD|
color=white|
bgcolor=blue|
line1=<CustomCurve1{{nbsp|2}}>|
line2=P1:{{nbsp|11}}2{{LCD/arrows|white}}|
caption=Custom curve '''CustomCurve1''' point '''P1''' value
}}
Note that to insert a up/down arrow symbol a special template is used. Here's the syntax:
{{LCD/arrows|color}}
where color can be: black, blue, red, magenta, green, cyan, yellow and white. Please use the same color as you do for the LCD font.
The result is as follows:
| <CustomCurve1 > |
P1: 2 |
Custom curve CustomCurve1 point P1 value
You can also float the LCD screen to left/right using an additional float parameter. For example, here is the previous example right-aligned:
{{LCD|
color=white|
float=right|
bgcolor=blue|
line1=<CustomCurve1{{nbsp|2}}>|
line2=P1:{{nbsp|11}}2{{LCD/arrows|white}}|
caption=Custom curve '''CustomCurve1''' point '''P1''' value
}}
| <CustomCurve1 > |
| P1: 2 |
Custom curve CustomCurve1 point P1 value
You should see the container to the right of this text.
To make an example of poor contrast of this screen, add one more parameter: contrast=poor-contrast. This makes the font barely visible. The full example is:
{{LCD|
color=white|
bgcolor=blue|
contrast=poor-contrast|
line1=<CustomCurve1{{nbsp|2}}>|
line2=P1:{{nbsp|11}}2{{LCD/arrows|white}}|
caption=Custom curve '''CustomCurve1''' point '''P1''' value
}}
Here's how it will look like:
| <CustomCurve1 > |
| P1: 2 |
Custom curve CustomCurve1 point P1 value
