diff --git a/Doc/Sd1/Ref/Fig/squareTable.png b/Doc/Sd1/Ref/Fig/squareTable.png index 933433f4ccb8226c2402f5491ed93fbafc37acef..d0359e081997a4bdb6e829cd1c186e04cba92a94 100644 Binary files a/Doc/Sd1/Ref/Fig/squareTable.png and b/Doc/Sd1/Ref/Fig/squareTable.png differ diff --git a/Doc/Sd1/Ref/Src/squareTable.html b/Doc/Sd1/Ref/Src/squareTable.html index 21b5ee1ea0d1b47c69d0662a29505d251e2e7cec..37c1856c73a3f1bae35a51b4aba18685134cf88e 100644 --- a/Doc/Sd1/Ref/Src/squareTable.html +++ b/Doc/Sd1/Ref/Src/squareTable.html @@ -1,269 +1,293 @@ <html xmlns='http://www.w3.org/1999/xhtml'> - <head> - <title>A square table</title> - <style> - table, th, td {border: 1px solid black;} - table {border-collapse: collapse;} - td {text-align: right;} - .greyColumn {background-color:LightGray;} - </style> - </head> + <head> + <meta charset="UTF-8"> + <title>A square table</title> + <style> + table, th, td { + border: 1px solid black; + } + + table { + border-collapse: collapse; + } + + td { + text-align: right; + } + + .greyColumn { + background-color: LightGray; + } + </style> + </head> <body> <table> <colgroup> - <col span='2'/> + <col span='2' /> <col span='2' class='greyColumn'/> <col span='2'/> <col span='2' class='greyColumn'/> <col span='2'/> </colgroup> <tr> - <th>n</th><th>n * n</th> - <th>n</th><th>n * n</th> - <th>n</th><th>n * n</th> - <th>n</th><th>n * n</th> - <th>n</th><th>n * n</th> + <th>n</th> + <th>n²</th> + <th>n</th> + <th>n²</th> + <th>n</th> + <th>n²</th> + <th>n</th> + <th>n²</th> + <th>n</th> + <th>n²</th> + </tr> + + <tr> + <td></td> + </tr> + <tr> + <td>1</td> + <td>1</td> + <td>21</td> + <td>441</td> + <td>41</td> + <td>1681</td> + <td>61</td> + <td>3721</td> + <td>81</td> + <td>6561</td> </tr> <tr> - <td>1</td> - <td>1</td> - <td>21</td> - <td>441</td> - <td>41</td> - <td>1681</td> - <td>61</td> - <td>3721</td> - <td>81</td> - <td>6561</td> + <td>2</td> + <td>4</td> + <td>22</td> + <td>484</td> + <td>42</td> + <td>1764</td> + <td>62</td> + <td>3844</td> + <td>82</td> + <td>6724</td> </tr> <tr> - <td>2</td> - <td>4</td> - <td>22</td> - <td>484</td> - <td>42</td> - <td>1764</td> - <td>62</td> - <td>3844</td> - <td>82</td> - <td>6724</td> + <td>3</td> + <td>9</td> + <td>23</td> + <td>529</td> + <td>43</td> + <td>1849</td> + <td>63</td> + <td>3969</td> + <td>83</td> + <td>6889</td> </tr> <tr> - <td>3</td> - <td>9</td> - <td>23</td> - <td>529</td> - <td>43</td> - <td>1849</td> - <td>63</td> - <td>3969</td> - <td>83</td> - <td>6889</td> + <td>4</td> + <td>16</td> + <td>24</td> + <td>576</td> + <td>44</td> + <td>1936</td> + <td>64</td> + <td>4096</td> + <td>84</td> + <td>7056</td> </tr> <tr> - <td>4</td> - <td>16</td> - <td>24</td> - <td>576</td> - <td>44</td> - <td>1936</td> - <td>64</td> - <td>4096</td> - <td>84</td> - <td>7056</td> + <td>5</td> + <td>25</td> + <td>25</td> + <td>625</td> + <td>45</td> + <td>2025</td> + <td>65</td> + <td>4225</td> + <td>85</td> + <td>7225</td> </tr> <tr> - <td>5</td> - <td>25</td> - <td>25</td> - <td>625</td> - <td>45</td> - <td>2025</td> - <td>65</td> - <td>4225</td> - <td>85</td> - <td>7225</td> + <td>6</td> + <td>36</td> + <td>26</td> + <td>676</td> + <td>46</td> + <td>2116</td> + <td>66</td> + <td>4356</td> + <td>86</td> + <td>7396</td> </tr> <tr> - <td>6</td> - <td>36</td> - <td>26</td> - <td>676</td> - <td>46</td> - <td>2116</td> - <td>66</td> - <td>4356</td> - <td>86</td> - <td>7396</td> + <td>7</td> + <td>49</td> + <td>27</td> + <td>729</td> + <td>47</td> + <td>2209</td> + <td>67</td> + <td>4489</td> + <td>87</td> + <td>7569</td> </tr> <tr> - <td>7</td> - <td>49</td> - <td>27</td> - <td>729</td> - <td>47</td> - <td>2209</td> - <td>67</td> - <td>4489</td> - <td>87</td> - <td>7569</td> + <td>8</td> + <td>64</td> + <td>28</td> + <td>784</td> + <td>48</td> + <td>2304</td> + <td>68</td> + <td>4624</td> + <td>88</td> + <td>7744</td> </tr> <tr> - <td>8</td> - <td>64</td> - <td>28</td> - <td>784</td> - <td>48</td> - <td>2304</td> - <td>68</td> - <td>4624</td> - <td>88</td> - <td>7744</td> + <td>9</td> + <td>81</td> + <td>29</td> + <td>841</td> + <td>49</td> + <td>2401</td> + <td>69</td> + <td>4761</td> + <td>89</td> + <td>7921</td> </tr> <tr> - <td>9</td> - <td>81</td> - <td>29</td> - <td>841</td> - <td>49</td> - <td>2401</td> - <td>69</td> - <td>4761</td> - <td>89</td> - <td>7921</td> + <td>10</td> + <td>100</td> + <td>30</td> + <td>900</td> + <td>50</td> + <td>2500</td> + <td>70</td> + <td>4900</td> + <td>90</td> + <td>8100</td> </tr> <tr> - <td>10</td> - <td>100</td> - <td>30</td> - <td>900</td> - <td>50</td> - <td>2500</td> - <td>70</td> - <td>4900</td> - <td>90</td> - <td>8100</td> + <td></td> </tr> <tr> - <td>11</td> - <td>121</td> - <td>31</td> - <td>961</td> - <td>51</td> - <td>2601</td> - <td>71</td> - <td>5041</td> - <td>91</td> - <td>8281</td> + <td>11</td> + <td>121</td> + <td>31</td> + <td>961</td> + <td>51</td> + <td>2601</td> + <td>71</td> + <td>5041</td> + <td>91</td> + <td>8281</td> </tr> <tr> - <td>12</td> - <td>144</td> - <td>32</td> - <td>1024</td> - <td>52</td> - <td>2704</td> - <td>72</td> - <td>5184</td> - <td>92</td> - <td>8464</td> + <td>12</td> + <td>144</td> + <td>32</td> + <td>1024</td> + <td>52</td> + <td>2704</td> + <td>72</td> + <td>5184</td> + <td>92</td> + <td>8464</td> </tr> <tr> - <td>13</td> - <td>169</td> - <td>33</td> - <td>1089</td> - <td>53</td> - <td>2809</td> - <td>73</td> - <td>5329</td> - <td>93</td> - <td>8649</td> + <td>13</td> + <td>169</td> + <td>33</td> + <td>1089</td> + <td>53</td> + <td>2809</td> + <td>73</td> + <td>5329</td> + <td>93</td> + <td>8649</td> </tr> <tr> - <td>14</td> - <td>196</td> - <td>34</td> - <td>1156</td> - <td>54</td> - <td>2916</td> - <td>74</td> - <td>5476</td> - <td>94</td> - <td>8836</td> + <td>14</td> + <td>196</td> + <td>34</td> + <td>1156</td> + <td>54</td> + <td>2916</td> + <td>74</td> + <td>5476</td> + <td>94</td> + <td>8836</td> </tr> <tr> - <td>15</td> - <td>225</td> - <td>35</td> - <td>1225</td> - <td>55</td> - <td>3025</td> - <td>75</td> - <td>5625</td> - <td>95</td> - <td>9025</td> + <td>15</td> + <td>225</td> + <td>35</td> + <td>1225</td> + <td>55</td> + <td>3025</td> + <td>75</td> + <td>5625</td> + <td>95</td> + <td>9025</td> </tr> <tr> - <td>16</td> - <td>256</td> - <td>36</td> - <td>1296</td> - <td>56</td> - <td>3136</td> - <td>76</td> - <td>5776</td> - <td>96</td> - <td>9216</td> + <td>16</td> + <td>256</td> + <td>36</td> + <td>1296</td> + <td>56</td> + <td>3136</td> + <td>76</td> + <td>5776</td> + <td>96</td> + <td>9216</td> </tr> <tr> - <td>17</td> - <td>289</td> - <td>37</td> - <td>1369</td> - <td>57</td> - <td>3249</td> - <td>77</td> - <td>5929</td> - <td>97</td> - <td>9409</td> + <td>17</td> + <td>289</td> + <td>37</td> + <td>1369</td> + <td>57</td> + <td>3249</td> + <td>77</td> + <td>5929</td> + <td>97</td> + <td>9409</td> </tr> <tr> - <td>18</td> - <td>324</td> - <td>38</td> - <td>1444</td> - <td>58</td> - <td>3364</td> - <td>78</td> - <td>6084</td> - <td>98</td> - <td>9604</td> + <td>18</td> + <td>324</td> + <td>38</td> + <td>1444</td> + <td>58</td> + <td>3364</td> + <td>78</td> + <td>6084</td> + <td>98</td> + <td>9604</td> </tr> <tr> - <td>19</td> - <td>361</td> - <td>39</td> - <td>1521</td> - <td>59</td> - <td>3481</td> - <td>79</td> - <td>6241</td> - <td>99</td> - <td>9801</td> + <td>19</td> + <td>361</td> + <td>39</td> + <td>1521</td> + <td>59</td> + <td>3481</td> + <td>79</td> + <td>6241</td> + <td>99</td> + <td>9801</td> </tr> <tr> - <td>20</td> - <td>400</td> - <td>40</td> - <td>1600</td> - <td>60</td> - <td>3600</td> - <td>80</td> - <td>6400</td> - <td>100</td> - <td>10000</td> + <td>20</td> + <td>400</td> + <td>40</td> + <td>1600</td> + <td>60</td> + <td>3600</td> + <td>80</td> + <td>6400</td> + <td>100</td> + <td>10000</td> </tr> </table> </body> -</html> +</html> \ No newline at end of file diff --git a/Doc/Sd1/statements.xml b/Doc/Sd1/statements.xml index f3d2b63c2d4789a4f395455f99ef7b48e36cceb9..07379d47065ce4eb61e5d99f41e5b619e8247438 100644 --- a/Doc/Sd1/statements.xml +++ b/Doc/Sd1/statements.xml @@ -402,7 +402,7 @@ if (b < 0) { ╲ ╱ "96=96"</emphasis></programlisting> - <para> Resolving this issue may be effected by adding an empty + <para>Resolving this issue may be effected by adding an empty string <coref linkend="sd1_qanda_betterSimpleMathEmptyString-1-co"/> forcing <xref linkend="glo_Java"/> to use the concatenation @@ -4291,28 +4291,28 @@ for (int col = 1; col <= SIZE; col++) { // using column values rangin elements require rearranging values in blocks avoiding waste of space:</para> - <screen> n | n*n n | n*n n | n*n n | n*n n | n*n + <screen> n | n² n | n² n | n² n | n² n | n² ----+--------------+--------------+--------------+--------------+---------- - 0 | 0 20 | 400 40 | 1600 60 | 3600 80 | 6400 - 1 | 1 21 | 441 41 | 1681 61 | 3721 81 | 6561 - 2 | 4 22 | 484 42 | 1764 62 | 3844 82 | 6724 - 3 | 9 23 | 529 43 | 1849 63 | 3969 83 | 6889 - 4 | 16 24 | 576 44 | 1936 64 | 4096 84 | 7056 - 5 | 25 25 | 625 45 | 2025 65 | 4225 85 | 7225 - 6 | 36 26 | 676 46 | 2116 66 | 4356 86 | 7396 - 7 | 49 27 | 729 47 | 2209 67 | 4489 87 | 7569 - 8 | 64 28 | 784 48 | 2304 68 | 4624 88 | 7744 - 9 | 81 29 | 841 49 | 2401 69 | 4761 89 | 7921 + 0 | 0 20 | 400 40 | 1600 60 | 3600 80 | 6400 + 1 | 1 21 | 441 41 | 1681 61 | 3721 81 | 6561 + 2 | 4 22 | 484 42 | 1764 62 | 3844 82 | 6724 + 3 | 9 23 | 529 43 | 1849 63 | 3969 83 | 6889 + 4 | 16 24 | 576 44 | 1936 64 | 4096 84 | 7056 + 5 | 25 25 | 625 45 | 2025 65 | 4225 85 | 7225 + 6 | 36 26 | 676 46 | 2116 66 | 4356 86 | 7396 + 7 | 49 27 | 729 47 | 2209 67 | 4489 87 | 7569 + 8 | 64 28 | 784 48 | 2304 68 | 4624 88 | 7744 + 9 | 81 29 | 841 49 | 2401 69 | 4761 89 | 7921 ----+--------------+--------------+--------------+--------------+---------- - 10 | 100 30 | 900 50 | 2500 70 | 4900 90 | 8100 - 11 | 121 31 | 961 51 | 2601 71 | 5041 91 | 8281 - 12 | 144 32 | 1024 52 | 2704 72 | 5184 92 | 8464 - 13 | 169 33 | 1089 53 | 2809 73 | 5329 93 | 8649 - 14 | 196 34 | 1156 54 | 2916 74 | 5476 94 | 8836 - 15 | 225 35 | 1225 55 | 3025 75 | 5625 95 | 9025 - 16 | 256 36 | 1296 56 | 3136 76 | 5776 96 | 9216 - 17 | 289 37 | 1369 57 | 3249 77 | 5929 97 | 9409 - 18 | 324 38 | 1444 58 | 3364 78 | 6084 98 | 9604 + 10 | 100 30 | 900 50 | 2500 70 | 4900 90 | 8100 + 11 | 121 31 | 961 51 | 2601 71 | 5041 91 | 8281 + 12 | 144 32 | 1024 52 | 2704 72 | 5184 92 | 8464 + 13 | 169 33 | 1089 53 | 2809 73 | 5329 93 | 8649 + 14 | 196 34 | 1156 54 | 2916 74 | 5476 94 | 8836 + 15 | 225 35 | 1225 55 | 3025 75 | 5625 95 | 9025 + 16 | 256 36 | 1296 56 | 3136 76 | 5776 96 | 9216 + 17 | 289 37 | 1369 57 | 3249 77 | 5929 97 | 9409 + 18 | 324 38 | 1444 58 | 3364 78 | 6084 98 | 9604 19 | 361 39 | 1521 59 | 3481 79 | 6241 99 | 9801</screen> <para>Building a table this way requires additional @@ -4339,40 +4339,37 @@ for (int col = 1; col <= SIZE; col++) { // using column values rangin </question> <answer> - <programlisting language="java">public static void main(String[] args) { - -// Table parameters + <programlisting language="java">// Table parameter final int - numBlocksHorizontal = 5, - numBlocksVertical = 2, - entriesPerBlock = 10; + numBlocksHorizontal = 5, + numBlocksVertical = 2, + entriesPerBlock = 10; // Derived parameter - final int numRows = numBlocksVertical * entriesPerBlock; +final int numRows = numBlocksVertical * entriesPerBlock; - System.out.println(" n | n*n ".repeat( // Printing the overall - numBlocksHorizontal)); // table's head section +System.out.println(" n | n² ".repeat( // Printing the overall + numBlocksHorizontal)); // table's head section - for (int y = 0; y < numBlocksVertical; y++) { // Looping through vertically stacked blocks. +for (int y = 0; y < numBlocksVertical; y++) { // Looping through vertically stacked blocks. - System.out.println( // Supplementary separator line between - "----+----------".repeat(numBlocksHorizontal)); // two vertically adjacent blocks + System.out.println( // Supplementary separator line between + "----+----------".repeat(numBlocksHorizontal)); // two vertically adjacent blocks - for (int row = 0; // Stepping through the given - row < entriesPerBlock; row++) { // block's rows ... + for (int row = 0; // Stepping through the given + row < entriesPerBlock; row++) { // block's rows ... - for (int col = 0; col < numBlocksHorizontal; col++) { // ... columns within each row. + for (int col = 0; col < numBlocksHorizontal; col++) { // ... columns within each row. - final int cellValue = y * entriesPerBlock // The cell's value - + col * numRows + row; // to be squared. + final int cellValue = y * entriesPerBlock // The cell's value + + col * numRows + row; // to be squared. - System.out.format("%3d | %4d ", // Pretty print cell value - cellValue, cellValue * cellValue); // and its square. - } - System.out.println(); + System.out.format("%3d | %4d ", // Pretty print cell value + cellValue, cellValue * cellValue); // and its square. + } + System.out.println(); } - } }</programlisting> </answer> </qandaentry> @@ -4386,13 +4383,10 @@ final int <qandadiv> <qandaentry> <question> - <para>A HTML of version of the previous square number table - may look like <link - xlink:href="/Sd1/Ref/Src/squareTable.html">squareTable.html</link>. - Inspect this generated HTML 5 code and modify your console - output from the previous exercise in order to produce - identical or similar HTML code. The expected outcome - is:</para> + <para>On top of the previous square number table we may also + create a HTML version.Modify your console output from the + previous exercise accordingly. The expected outcome looks + like:</para> <screenshot> <info> @@ -4410,56 +4404,22 @@ final int <tip> <orderedlist> <listitem> - <para>The <xref linkend="glo_HTML"/> standard allows for - quoting attribute values either by double <emphasis - role="red">"</emphasis> or by single <emphasis - role="red">'</emphasis> quotes:</para> - - <itemizedlist> - <listitem> - <para><tag class="starttag">html <tag - class="attribute">xmlns = <emphasis - role="red">"</emphasis>http://www.w3.org/1999/xhtml<emphasis - role="red">"</emphasis></tag></tag></para> - </listitem> - - <listitem> - <para><tag class="starttag">html <tag - class="attribute">xmlns = <emphasis - role="red">'</emphasis>http://www.w3.org/1999/xhtml<emphasis - role="red">'</emphasis></tag></tag></para> - </listitem> - </itemizedlist> - - <para>The latter is more convenient when being embedded - in <xref linkend="glo_Java"/> code since it does not - interfere with string literal delimiters:</para> - - <programlisting language="java">System.out.print("<tag - class="starttag">html <tag class="attribute">xmlns = <emphasis - role="red">'</emphasis>http://www.w3.org/1999/xhtml<emphasis - role="red">'</emphasis></tag></tag>");</programlisting> - - <para>rather than the more clumsy:</para> - - <programlisting language="java">System.out.print("<tag - class="starttag">html <tag class="attribute">xmlns = <emphasis - role="red">\"</emphasis>http://www.w3.org/1999/xhtml<emphasis - role="red">\"</emphasis></tag></tag>");</programlisting> + <para>You find a suitable HTML code sample to be + generated at <link + xlink:href="/Sd1/Ref/Src/squareTable.html">squareTable.html</link>.</para> </listitem> <listitem> - <para>Depending on your advance in HTML and <xref - linkend="glo_CSS"/> you may want to postpone this - exercise until <xref linkend="glo_HTML"/> and <xref - linkend="glo_CSS"/> have been thoroughly covered in - <link + <para>Depending on your advance in <xref + linkend="glo_HTML"/> and <xref linkend="glo_CSS"/> you + may want to postpone this exercise until these two have + been thoroughly covered in <link xlink:href="https://www.hdm-stuttgart.de/studierende/stundenplan/vorlesungsverzeichnis/vorlesung_detail?vorlid=5213267">related lectures</link>.</para> </listitem> <listitem> - <para>You may create an expected output HTML table + <para>You may also create an expected output HTML table manually <abbrev>e.g.</abbrev> in a separate file <filename>squaretable.html</filename> until its browser view satisfies your expectations. Only then do you know @@ -4475,64 +4435,73 @@ final int style definitions in the generated HTML's header section being referenced from the document's body.</para> - <programlisting language="java">public static void main(String[] args) { - - final int numBlocksHorizontal = 5, numBlocksVertical = 2, entriesPerBlock = 10; - - final int numRows = numBlocksVertical * entriesPerBlock; - - System.out.print("" + "<html xmlns='http://www.w3.org/1999/xhtml'>\n" - + " <head>\n" + " <title>A square table</title>\n" + " <style>\n" - + " table, th, td {border: 1px solid black;}\n" - + " table {border-collapse: collapse;}\n" - + " td {text-align: right;}\n" - + " .greyColumn {background-color:LightGray;}\n" - + " </style>\n" + " </head>\n" + " <body>\n" + " <table>\n" - + " <colgroup>\n"); - - for (int x = 0; x < numBlocksHorizontal; x++) { // Creating the overall - // table's head section + <programlisting language="java">// Block 1: Setting table parameter +final int numBlocksHorizontal = 5, + numBlocksVertical = 2, + entriesPerBlock = 10; + +final int numRows = numBlocksVertical * entriesPerBlock; + +// Block 2: Printing table's static head +System.out.println(""" + <html xmlns='http://www.w3.org/1999/xhtml'> + <head> + <meta charset="UTF-8"> + <title>A square table</title> + <style> + table, th, td {border: 1px solid black;} + table {border-collapse: collapse;} + td {text-align: right;} + .greyColumn {background-color:LightGray;} + </style> + </head> + <body> + <table> + <colgroup>"""); + +// Block 3: Creating »n | n² | n | n² ...« table header +for (int x = 0; x < numBlocksHorizontal; x++) { // Creating the overall + // table's head section. if (0 == x % 2) { - System.out.println(" <col span='2'/>"); + System.out.println(" <col span='2'/>"); } else { - System.out.println(" <col span='2' class='greyColumn'/>"); + System.out.println(" <col span='2' class='greyColumn'/>"); } - } - System.out.println(" </colgroup>"); +} +System.out.println(" </colgroup>"); - System.out.println(" <tr>"); - for (int x = 0; x < numBlocksHorizontal; x++) { // n | n^2 header line - - System.out.println(" <th>n</th><th>n * n</th>"); - } - System.out.println(" </tr>"); +System.out.println(" <tr>"); +for (int x = 0; x < numBlocksHorizontal; x++) { // n | n² header line + System.out.println(" <th>n</th><th>n²</th>"); +} +System.out.println(" </tr>\n"); - System.out.println(); - for (int y = 0; y < numBlocksVertical; y++) { // Blocks stacked below - // another +// Block 4: The table's »payload«. +for (int y = 0; y < numBlocksVertical; y++) { // Blocks stacked below another - System.out.println( // Block separating - " <tr><td></td></tr>"); // extra row. + System.out.println(" <tr><td></td></tr>"); // extra row. for (int yBlock = 0; - yBlock < entriesPerBlock; yBlock++) { // Stepping through - // values vertically ... - System.out.println(" <tr>"); - for (int x = 0; x < numBlocksHorizontal; x++) { // and horizontally - // within each line. - - final int cellValue = 1 + yBlock // The individual - + x * numRows + y * entriesPerBlock; // value to be squared. - - System.out.println( // Pretty print output - " <td>" + cellValue + "</td><td>" // values. - + cellValue * cellValue + "</td>"); - } - System.out.println(" </tr>"); + yBlock < entriesPerBlock; yBlock++) { // Stepping through values vertically ... + System.out.println(" <tr>"); + for (int x = 0; x < numBlocksHorizontal; x++) { // and horizontally within each line. + final int cellValue = 1 + yBlock // The individual value to be squared. + + x * numRows + y * entriesPerBlock; + + System.out.println( // Pretty print output + " <td>" + cellValue + "</td><td>" // value and its square. + + cellValue * cellValue + "</td>"); + } + System.out.println(" </tr>"); } - } - System.out.print("" + " </table>\n" + " </body>\n" + "</html>\n"); -}</programlisting> +} + +// Block 5: The table's tail +System.out.print(""" + </table> + </body> + </html>"""); +</programlisting> </answer> </qandaentry> </qandadiv>