Commit 8f338da4 authored by Karishma Chadha's avatar Karishma Chadha

Merge branch 'master' of github.com:mit-cml/app-inventor-private into issue181

parents 794cce90 2cfbb4ee
...@@ -36,8 +36,9 @@ public final class ErrorReporter { ...@@ -36,8 +36,9 @@ public final class ErrorReporter {
* Initializes the ErrorPopup. * Initializes the ErrorPopup.
*/ */
ErrorPopup() { ErrorPopup() {
super(false); super(true); //constructor for PopupPanel class. "True" initializes the "auto-hide" variable
// I'm leaving this setSTyleName line here as a comment, to show the typical way to define // I'm leaving this setSTyleName line here as a comment, to show the typical way to define
// the style. // the style.
// I would have preferred to use this method rather than constructing the HTML by hand, // I would have preferred to use this method rather than constructing the HTML by hand,
......
...@@ -33,7 +33,7 @@ public class FeedbackReporter extends JOptionPane { ...@@ -33,7 +33,7 @@ public class FeedbackReporter extends JOptionPane {
// TODO(sharon): clickable links not yet implemented // TODO(sharon): clickable links not yet implemented
/*private static final String TROUBLESHOOTING_LINK = /*private static final String TROUBLESHOOTING_LINK =
"<hr><p>The <a href=\"http://appinventor.googlelabs.com/learn/troubleshooting.html\">" "<hr><p>The <a href=\"http://beta.appinventor.mit.edu/learn/troubleshooting.html\">"
+ "Troubleshooting Guide</a> may provide further help.</p>"; + "Troubleshooting Guide</a> may provide further help.</p>";
*/ */
private static final String TROUBLESHOOTING_LINK = private static final String TROUBLESHOOTING_LINK =
......
...@@ -43,6 +43,15 @@ ...@@ -43,6 +43,15 @@
colors can also be selected from the color dropdown lists in the Designer's colors can also be selected from the color dropdown lists in the Designer's
Properties panel. Properties panel.
</p> </p>
<h3>
Using Predefined Colors
</h3>
<p>
Predefined colors are listed in the Colors drawer.
</p>
<div class="imagecontainer">
<img alt="" src="images/predefinedcolors.png" width="162" />
</div>
<h3> <h3>
Making your own colors Making your own colors
</h3> </h3>
...@@ -67,7 +76,7 @@ ...@@ -67,7 +76,7 @@
<em> <em>
B B
</em> </em>
specifications for may colors, or you can experiment with your own specifications for many colors, or you can experiment with your own
<em> <em>
R R
</em> </em>
...@@ -90,100 +99,43 @@ ...@@ -90,100 +99,43 @@
underlying screen will show though. underlying screen will show though.
</p> </p>
<p> <p>
To get a color number for App Inventor, combine the four numbers according to the A "make color" block will take a list of your
following algorithm: <em>
</p> R
<ol> </em>
<li> ,
Start with the opacity. <em>
</li> G
<li> </em>
Multiply this by 256 and add ,
<em> <em>
R B
</em> </em>
. and opacity components and create
</li> that color for you. The opacity component is optional, if omitted is set to 255. A
<li> "split color" block takes a color and returns a list of the four number components.
Multiply the result by 256 and add
<em>
G
</em>
.
</li>
<li>
Multiply the result by 256 and add
<em>
B
</em>
.
</li>
<li>
Take the result and subtract 16
<sup>
8
</sup>
= 4294967296
</li>
<li>
The resulting (negative) number is what you use for App Inventor.
</li>
</ol>
<p>
As an example, the
<em>
R
</em>
,
<em>
G
</em>
,
<em>
B
</em>
values for a deep shade of
purple are
<em>
R
</em>
= 160,
<em>
G
</em>
= 32,
<em>
B
</em>
= 240. Applying the
algorithm to these values, with an opacity of 255, gives −6283024. If you set the
background color of a canvas to −6283024, you'll see a purple patch on the screen.
</p> </p>
<p> <p>
<a href="colorchart.html"> <a href="colorchart.html">
Here is a chart This chart
</a> </a>
that gives the numbers for a variety gives the numbers for a variety
of colors. of colors.
</p> </p>
<p> <p>
And here's a blocks program that computes the color number given Here's a sample program that assigns the name purple to the color with R=160, G=32, B= 240,
<em> and opacity = 255.
R </p>
</em> <div class="imagecontainer">
, <img alt="" src="images/makecolor.png" width="483" />
<em> </div>
G <p>
</em> Using the "split color" block, the user can manipulate the R, G, B and opacity values separately.
, and Here’s an example program using “split color”. The procedure takes in a color and then
<em> returns a new color with the opacity at 100.
B
</em>
. The opacity is fixed ar 255, but you can change that by
changing the global variable.
</p> </p>
<div class="imagecontainer"> <div class="imagecontainer">
<img alt="" src="images/colorNumber.png" width="735" /> <img alt="" src="images/splitcolor.png" width="561" />
</div> </div>
</div> </div>
</div> </div>
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment