Skillnad mellan versioner av "Kap 14 Windowsprogrammering (50)"

Från Mathonline
Hoppa till: navigering, sök
m
m
 
(13 mellanliggande versioner av samma användare visas inte)
Rad 16: Rad 16:
  
 
= <b><span style="color:#931136">Kap 14 &nbsp; Windowsprogrammering (forts.)</span></b> =
 
= <b><span style="color:#931136">Kap 14 &nbsp; Windowsprogrammering (forts.)</span></b> =
== <b><span style="color:#931136">&nbsp; Genomgång av [[Övningar_48_(C/Cpp_23)#V.C3.A5r_f.C3.B6rsta_GUI-.C3.B6vning|<span style="color:blue"> övn 14.3</span>]]</span></b> ==
+
== <b><span style="color:#931136">&nbsp; Genomgång av [[Övningar_49_(C/Cpp_23)#Projektet_Addition|<span style="color:blue"> övn 14.3</span>]]</span></b> ==
<div class="ovnE">
+
<div class="ovnC">
 
=== <b><span style="color:#931136"> &nbsp; Projektet Addition</span></b> ===
 
=== <b><span style="color:#931136"> &nbsp; Projektet Addition</span></b> ===
 
<div style="border:1px solid black;display:inline-table;margin-left: 0px;"> [[Image: Ovn_14_3_F_1.jpg]]</div>
 
<div style="border:1px solid black;display:inline-table;margin-left: 0px;"> [[Image: Ovn_14_3_F_1.jpg]]</div>
Rad 34: Rad 34:
  
 
== <b><span style="color:#931136">Projektet DevBrowser med tre olika Windows Forms</span></b> ==
 
== <b><span style="color:#931136">Projektet DevBrowser med tre olika Windows Forms</span></b> ==
<div class="ovnC">
+
<div class="ovnE">
===== <b><span style="color:#931136">Den 1:a formen med WebBrowser-kontrollen och en menyrad (ovan) med två menyer:</span></b> =====
+
===== <b><span style="color:#931136">Den 1:a formen med WebBrowser-kontrollen och två menyer (Navigate & Help):</span></b> =====
 
<div style="border:1px solid black;display:inline-table;margin-left: 0px;"> [[Image: DevBrowser.jpg]]</div>
 
<div style="border:1px solid black;display:inline-table;margin-left: 0px;"> [[Image: DevBrowser.jpg]]</div>
 
</div>
 
</div>
  
  
= <b><span style="color:#931136">Dialogrutan Navigate</span></b> =
+
= <b><span style="color:#931136">Den 2:a formen</span></b> =
 
<div class="ovnA">
 
<div class="ovnA">
===== <b><span style="color:#931136">Den 2:a formen med olika kontroller:</span></b> =====
+
===== <b><span style="color:#931136">Dialogrutan Navigate</span></b> =====
 
<div style="border:1px solid black;display:inline-table;margin-left: 0px;"> [[Image: Navigate.jpg]]</div>
 
<div style="border:1px solid black;display:inline-table;margin-left: 0px;"> [[Image: Navigate.jpg]]</div>
 
<big>
 
<big>
Rad 54: Rad 54:
  
  
= <b><span style="color:#931136">Dialogrutan About Box</span></b> =
+
= <b><span style="color:#931136">Den 3:e formen</span></b> =
 
<div class="ovnE">
 
<div class="ovnE">
===== <b><span style="color:#931136">Den 3:e formen:</span></b> =====
+
===== <b><span style="color:#931136">Dialogrutan About Box</span></b> =====
 
<div style="border:1px solid black;display:inline-table;margin-left: 0px;"> [[Image: About_Box.jpg]]</div>
 
<div style="border:1px solid black;display:inline-table;margin-left: 0px;"> [[Image: About_Box.jpg]]</div>
 
<big>
 
<big>
Rad 69: Rad 69:
  
  
= <b><span style="color:#931136">Följ instruktionerna till detta projekt i [http://mathonline.se:1802/Boken%20OOP_design.pdf <span style="color:blue">kursboken</span>], sid 160-166.</span></b> =
+
<div class="border-divblue">
 +
=== <b><span style="color:#931136">Följ instruktionerna till projektet DevBrowser i [http://mathonline.se/Boken%20Programmering%20i%20C%20och%20Cpp.pdf <span style="color:blue">kursboken</span>], sid 415-420.</span></b> ===
 +
</div>
  
+++
 
  
= <b><span style="color:#931136">14.4 &nbsp; En egen webbläsare</span></b> =
+
= <b><span style="color:#931136">Koden till projektet DevBrowser</span></b> =
 
+
 
+
= <b><span style="color:#931136">Projektet FirstBrowser</span></b> =
+
 
<div class="ovnE">
 
<div class="ovnE">
===== <b><span style="color:#931136">När det är klart:</span></b> =====
+
=== <b><span style="color:#931136">Klassen Form1</span></b> ===
<div style="border:1px solid black;display:inline-table;margin-left: 0px;"> [[Image: MyFirstBrowser.jpg]]</div>
+
<div style="border:1px solid black;display:inline-table;margin-left: 0px;"> [[Image: DevBrowser_Form1.jpg]]</div>
 
</div>
 
</div>
  
  
= <b><span style="color:#931136">Kontrollen WebBrowser</span></b> =
+
= <b><span style="color:#931136">14.6 &nbsp; Färgtest med kontrollen HScrollBar</span></b> =
 
<div class="ovnC">
 
<div class="ovnC">
===== <b><span style="color:#931136">När man hämtat den från Toolbox:</span></b> =====
+
=== <b><span style="color:#931136">3 HscrollBars, 6 Labels & 1 Button</span></b> ===
<div style="border:1px solid black;display:inline-table;margin-left: 0px;"> [[Image: WebBrowser.jpg]]</div>
+
<div style="border:1px solid black;display:inline-table;margin-left: 0px;"> [[Image: ColorTest_1.jpg]]</div>
 +
</div>
  
===== <b><span style="color:#931136">Några egenskaper av den nya WebBrowser-kontrollen:</span></b> =====
+
 
 +
= <b><span style="color:#931136">Projektet ColorTest</span></b> =
 +
<div class="ovnA">
 
<big>
 
<big>
* &nbsp; &nbsp; Täcker hela formen: <b><span style="color:red">Docked in Parent Container</span></b>.
+
Tre horisontella scrollbars visas till vänster. Med deras reglage kan man ställa in
* &nbsp; &nbsp; <b><span style="color:red">Parent Container</span> = Formen</b>.
+
 
* &nbsp; &nbsp; Med <i>Smart Tag</i> (lilla pilen) i det högre översta hörnet
+
ett önskat värde mellan <math> \; 0</math>-<math>255 </math>, <b>RGB</b>-modellens färgkomponenter <b>R</b>öd, <b>G</b>rön, <b>B</b>lå.
 +
 
 +
När alla tre värden är valda ska en klick på knappen Visa Färg visa den valda färg-
 +
 
 +
blandningen i Formens bakgrund. Dessutom ska RGB-värdena visas på labeln till
  
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; kan man ändra till <b><span style="color:red">Undock in Parent Container</span></b>, dvs:
+
höger om reglaget. Sammanlagt är <math> \; 256\,^3 \, = \, 16\,777\,216 \; </math> färgnuanser möjliga.
  
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; lösa kontrollen från formen och placera den valfritt.
+
Exempel:
 +
<div style="border:1px solid black;display:inline-table;margin-left: 0px;"> [[Image: ColorTest_2.jpg]]</div>
  
* &nbsp; &nbsp; Välj <b><span style="color:red">Undock ... </span></b> och ändra storleken senare.  
+
För att bygga detta projekt följ instruktionerna i kursboken, sid 22-25.
 
</big>
 
</big>
 
</div>
 
</div>
  
  
= <b><span style="color:#931136">Koden till projektet FirstBrowser</span></b> =
+
= <b><span style="color:#931136">Kod bakom knappen Visa färg</span></b> =
 
<div class="ovnE">
 
<div class="ovnE">
=== <b><span style="color:#931136">Dubbelklicka i formen på Kör-knappen och ... </span></b> ===
+
<big>
==== <b><span style="color:#931136">Lägg till följande sats i händelsemetoden btnGo_Click():</span></b> ====
+
<div style="border:1px solid black;display:inline-table;margin-left: 0px;"> [[Image: Koden_Visa_Farg.jpg]]</div>
<div style="border:1px solid black;display:inline-table;margin-left: 0px;"> [[Image: btnGo_Click.jpg]]</div>
+
</big>
 
</div>
 
</div>
  
  
== <b><span style="color:#931136">Följ instruktionerna till detta projekt i [http://mathonline.se/Boken%20Programmering%20i%20C%20och%20Cpp.pdf <span style="color:blue">kursboken</span>], sid 411-414.</span></b> ==
+
<div class="ovnC">
 
+
=== <b><span style="color:#931136">Följ instruktionerna till projektet ColorTest i [http://mathonline.se/Boken%20Programmering%20i%20C%20och%20Cpp.pdf <span style="color:blue">kursboken</span>], sid 421-424.</span></b> ===
 +
</div>
  
 
<br><br>
 
<br><br>
  
 
<div class="border-divblue">
 
<div class="border-divblue">
=== <b><span style="color:#931136">Gå vidare till: &nbsp;&nbsp;<div class="smallBox">[[Övningar 49 (C/Cpp 23)|<span style="color:blue">Övningar 49</span>]]</div> &nbsp;&nbsp;&nbsp; när du är klar med denna genomgång.</span></b> ===
+
=== <b><span style="color:#931136">Gå vidare till: &nbsp;&nbsp;<div class="smallBox">[[Övningar 50 (C/Cpp 23)|<span style="color:blue">Övningar 50</span>]]</div> &nbsp;&nbsp;&nbsp; när du är klar med denna genomgång.</span></b> ===
 
</div>
 
</div>
  

Nuvarande version från 12 december 2023 kl. 22.01

Ons 13 dec, kl 9-12


        <<  Agenda          Genomgång 50          Övningar 50          Innehåll & struktur          Nästa lektion  >>      


Kap 14   Windowsprogrammering (forts.)

  Genomgång av övn 14.3

  Projektet Addition

Ovn 14 3 F 1.jpg


Ovn 14 3 F 2.jpg


Klassen Form1

Ovn 14 3 F 3.jpg


14.5   En mer utvecklad webbläsare

Projektet DevBrowser med tre olika Windows Forms

Den 1:a formen med WebBrowser-kontrollen och två menyer (Navigate & Help):
DevBrowser.jpg


Den 2:a formen

Dialogrutan Navigate
Navigate.jpg

  •     Ersätter TextBoxen i den första versionen för inmatning av webbadress.
  •     Visas när man klickar på Navigate-menyn i den 1:a formen ovan.
  •     Innehåller fem kontroller:

          en Label, en TextBox, två Buttons och en TableLayoutPanel (osynlig).


Den 3:e formen

Dialogrutan About Box
About Box.jpg

  •     Visas när man klickar på Help-menyn samt på

          undermenyn About... i den 1:a formen.

  •     Återgår till den 1:a formen när man klickar på OK.
  •     Innehåller redan kontroller. Vi ändrar ingenting.
  •     Kan användas för att visa information om DevBrowser.


Följ instruktionerna till projektet DevBrowser i kursboken, sid 415-420.


Koden till projektet DevBrowser

Klassen Form1

DevBrowser Form1.jpg


14.6   Färgtest med kontrollen HScrollBar

3 HscrollBars, 6 Labels & 1 Button

ColorTest 1.jpg


Projektet ColorTest

Tre horisontella scrollbars visas till vänster. Med deras reglage kan man ställa in

ett önskat värde mellan \( \; 0\)-\(255 \), RGB-modellens färgkomponenter Röd, Grön, Blå.

När alla tre värden är valda ska en klick på knappen Visa Färg visa den valda färg-

blandningen i Formens bakgrund. Dessutom ska RGB-värdena visas på labeln till

höger om reglaget. Sammanlagt är \( \; 256\,^3 \, = \, 16\,777\,216 \; \) färgnuanser möjliga.

Exempel:

ColorTest 2.jpg

För att bygga detta projekt följ instruktionerna i kursboken, sid 22-25.


Kod bakom knappen Visa färg

Koden Visa Farg.jpg


Följ instruktionerna till projektet ColorTest i kursboken, sid 421-424.



Gå vidare till:        när du är klar med denna genomgång.












Copyright © 2023. All Rights Reserved.