„Kliensalkalmazások” változatai közötti eltérés
a →2024. tavasz: Kód javítása |
Órák anyagának és segédanyagoknak a hozzáadása |
||
| 76. sor: | 76. sor: | ||
====Android==== | ====Android==== | ||
*8. hét: ''szünet'' | *8. hét: ''szünet'' | ||
*[[Média:Kliens ea 09 20240408.pdf|9. hét (Gazdi László)]]: alapok, Java; View (XML): <code>TextView</code>; eseménykezelés, Kotlin; '''<code>Activity</code>, <code>Service</code>, | *[[Média:Kliens ea 09 20240408.pdf|9. hét (Gazdi László)]]: alapok, Java; <code>View</code> (XML): <code>TextView</code>; eseménykezelés, Kotlin; '''<code>Activity</code>, <code>Service</code>, <code>ContentProvider</code>, <code>BroadcastReceiver</code>;''' manifest, erőforrások; <code>.dex</code> compiler (Dalvik bytecode), <code>.apk</code>; '''activity lifecycle''' (callback függvények, állapot mentése, váltás) | ||
**Megjegyzések a 16. diához: | **Megjegyzések a 16. diához: | ||
***Az OS X már 2016 óta macOS. | ***Az OS X már 2016 óta macOS. | ||
***A [[wikipedia:Cocoa Touch|Cocoa Touch]] helyett már 2019 óta [[wikipedia:SwiftUI|SwiftUI]] van. | ***A [[wikipedia:Cocoa Touch|Cocoa Touch]] helyett már 2019 óta [[wikipedia:SwiftUI|SwiftUI]] van. | ||
***Az [[wikipedia:Interface Builder|Interface Builder]] már 2010 óta az [[wikipedia:Xcode|Xcode]] része. | ***Az [[wikipedia:Interface Builder|Interface Builder]] már 2010 óta az [[wikipedia:Xcode|Xcode]] része. | ||
*[[Média:Kliens ea 10 20240415.pdf|10. hét (Gazdi László)]]: '''<code>Activity</code>''': back stack, vezérlés; <code>Intent</code>: típusai, részei, explicit / implicit, extras, képességek, filter; <code>startActivityForResult()</code>, <code>onActivityResult()</code>; erőforrások | *[[Média:Kliens ea 10 20240415.pdf|10. hét (Gazdi László)]]: '''<code>Activity</code>''': back stack, vezérlés; <code>Intent</code>: típusai, részei, explicit / implicit, extras, képességek, filter; <code>startActivityForResult()</code>, <code>onActivityResult()</code>; erőforrások: i18n, <code>res/drawable</code>, <code>/layout</code>, <code>/value</code>; UI: <code>viewBinding</code>; dpi, <code>dp</code>, <code>sp</code>; <code>LinearLayout</code>, <code>RelativeLayout</code>, <code>ConstraintLayout</code>; padding és margin | ||
*[[Média:Kliens ea 11 20240422.pdf|11. hét (Pásztor Dániel)]]: <code>View</code>: <code>getLayoutInflater()</code>, validáció, <code>Menu</code>, <code>ActionBar</code>, <code>Toolbar</code>; <code>PopupWindow</code>, <code>AlertDialog</code>, <code>Snackbar</code>; <code>style</code>, <code>Theme</code>; grafikák, animációk | *[[Média:Kliens ea 11 20240422.pdf|11. hét (Pásztor Dániel)]]: <code>View</code>: <code>getLayoutInflater()</code>, validáció, <code>Menu</code>, <code>ActionBar</code>, <code>Toolbar</code>; <code>PopupWindow</code>, <code>AlertDialog</code>, <code>Snackbar</code>; <code>style</code>, <code>Theme</code>; grafikák, animációk | ||
**Habár a diasoron én nem láttam példát az <code>ImageView</code> használatára, [[Kliensalkalmazások#:~:text=Vázolja fel a képen látható nézet kódját a View framework segítségével!|a vizsgán kérdezik]]. De legalább az egyik laboron [https://bmeviaubb03.github.io/laborok/laborok/android/ui-basics/#:~:text=A%20m%C3%A1sik%20%C3%BAjdons%C3%A1g%20itt%20az%20ImageView%20haszn%C3%A1lata. szó esik róla]. | **Habár a diasoron én nem láttam példát az <code>ImageView</code> használatára, [[Kliensalkalmazások#:~:text=Vázolja fel a képen látható nézet kódját a View framework segítségével!|a vizsgán kérdezik]]. De legalább az egyik laboron [https://bmeviaubb03.github.io/laborok/laborok/android/ui-basics/#:~:text=A%20m%C3%A1sik%20%C3%BAjdons%C3%A1g%20itt%20az%20ImageView%20haszn%C3%A1lata. szó esik róla]. | ||
*[[Média:Kliens ea 12 20240429.pdf|12. hét (Gazdi László)]]: <code>Fragment</code>: életciklus, csatolása (statikusan és dinamikusan), <code>FragmentManager</code>, <code>FragmentTransaction</code>, kommunikáció, <code>DialogFragment</code>; <code>navigation</code>: component, graph; <code>RecyclerView</code>: <code>ViewHolder</code>, <code>Adapter</code>; perzisztens adattárolás: <code>(Shared)Preferences</code>, SQLite, ORM, <code>room</code>, javasolt architektúra; fájlkezelés: internal / external storage, statikus fájlok, nyilvános lemezterület; BaaS: Firebase; ''' | *[[Média:Kliens ea 12 20240429.pdf|12. hét (Gazdi László)]]: <code>Fragment</code>: életciklus, csatolása (statikusan és dinamikusan), <code>FragmentManager</code>, <code>FragmentTransaction</code>, kommunikáció, <code>DialogFragment</code>; <code>navigation</code>: component, graph; <code>RecyclerView</code>: <code>ViewHolder</code>, <code>Adapter</code>; perzisztens adattárolás: <code>(Shared)Preferences</code>, SQLite, ORM, <code>room</code>, javasolt architektúra; fájlkezelés: internal / external storage, statikus fájlok, nyilvános lemezterület; BaaS: Firebase; '''<code>ContentProvider</code>:''' elérése (<code>CONTENT_URI</code>), műveletek, engedélyek, <code>Cursor</code>, <code>ContentResolver</code>, CRUD | ||
**Megjegyzés az 51. diához: a <code>BLOB</code> is egy támogatott adattípus. | **Megjegyzés az 51. diához: a <code>BLOB</code> is egy támogatott adattípus. | ||
*[[Média:Kliens ea 13 20240506.pdf|13. hét (Gazdi László)]]: Jetpack Compose: <code>@Composable</code> '''(5 szabálya),''' <code>@Preview</code>, layoutok (<code>Column</code>, <code>Row</code>, <code>Box</code>), weight, <code>Alignment</code> és <code>Arrangement</code>, <code>Modifier</code>, <code>Scaffold</code>, <code>TextField</code>, Material Design; mappastruktúra, composition / initial composition / recomposition, adatok átadása; <code>ViewModel</code>: MVVM, MVI; navigation graph: funkciók, paraméterek, konstansok; dialógusok: <code>AlertDialog</code>; listák: lazy loading; szálak és coroutine-ok: suspending functions; flow | *[[Média:Kliens ea 13 20240506.pdf|13. hét (Gazdi László)]]: Jetpack Compose: <code>@Composable</code> '''(5 szabálya),''' <code>@Preview</code>, layoutok (<code>Column</code>, <code>Row</code>, <code>Box</code>), weight, <code>Alignment</code> és <code>Arrangement</code>, <code>Modifier</code>, <code>Scaffold</code>, <code>TextField</code>, Material Design; mappastruktúra, composition / initial composition / recomposition, adatok átadása; <code>ViewModel</code>: MVVM, MVI; navigation graph: funkciók, paraméterek, konstansok; dialógusok: <code>AlertDialog</code>; listák: lazy loading; szálak és coroutine-ok: suspending functions; flow | ||
| 112. sor: | 112. sor: | ||
***módosítani lehet vele egy osztályt vagy annak tagjainak működését | ***módosítani lehet vele egy osztályt vagy annak tagjainak működését | ||
***pl.:<syntaxhighlight lang="ts" line="1"> | ***pl.:<syntaxhighlight lang="ts" line="1"> | ||
function logged(originalMethod: any | function logged(originalMethod: any) { | ||
try { | |||
console.log("Calculation started..."); | |||
return (...args: any[]) => originalMethod.call(this, ...args); | |||
} | |||
finally { | |||
console.log("...finished!"); | |||
} | } | ||
} | } | ||
| 145. sor: | 143. sor: | ||
function makeDate(epochOrYear: number, month?: number, day?: number): Date { | function makeDate(epochOrYear: number, month?: number, day?: number): Date { | ||
if (month !== undefined && day !== undefined) { | if (month !== undefined && day !== undefined) { | ||
return new Date(epochOrYear, month, day); | return new Date(epochOrYear, month-1, day); | ||
} else { | } else { | ||
return new Date(epochOrYear); | return new Date(epochOrYear); | ||
| 151. sor: | 149. sor: | ||
} | } | ||
const dateFromEpoch = makeDate(1719082884000); | const dateFromEpoch = makeDate(1719082884000); | ||
const dateFromDate = makeDate(2024, 6 | const dateFromDate = makeDate(2024, 6, 22); | ||
</syntaxhighlight>a 3. sorban található az implementációs szignatúra | </syntaxhighlight>a 3. sorban található az implementációs szignatúra | ||
****mindig csak egy lehet belőle | ****mindig csak egy lehet belőle | ||
| 187. sor: | 185. sor: | ||
*****csak a tagen belüli szövegre vonatkozik | *****csak a tagen belüli szövegre vonatkozik | ||
**''Mire valóak az űrlapok?'' | **''Mire valóak az űrlapok?'' | ||
***adatok beküldésére | |||
****kérdőív | |||
****belépés | |||
***meglévő adatok módosítására | |||
****az adatmezőket előre ki lehet tölteni | |||
***a bevitt adatokat azok rögzítése előtt még validálni lehet | |||
****kliens- vagy szerveroldalon | |||
***általában GET vagy POST queryt hajt végre az oldal a beküldés után | |||
****pl. egy mögöttes adatbázisból lehet lekérni, vagy abban módosítani adatokat | |||
**''Mire való egy űrlap elemeiben a <code>name</code> attribútum?'' | **''Mire való egy űrlap elemeiben a <code>name</code> attribútum?'' | ||
***egyes beviteli mezők elnevezésére | ***egyes beviteli mezők elnevezésére | ||
| 197. sor: | 204. sor: | ||
***declaration file | ***declaration file | ||
***kizárólag a hozzá tartozó JavaScript-fájl típusinformációit tartalmazza | ***kizárólag a hozzá tartozó JavaScript-fájl típusinformációit tartalmazza | ||
***gyakorlatilag ugyanaz, mint Pythonban a [https://typing.readthedocs.io/en/latest/source/stubs.html type stub] | ***gyakorlatilag ugyanaz, mint Pythonban a [https://typing.readthedocs.io/en/latest/source/stubs.html type stub] – bár a TypeScript fordításidőben jelzi a típusokkal kapcsolatos problémákat (Pythonban ezeket csak az IDE mutatja) | ||
**''Milyen előnyei vannak a dependency injection használatának?'' | **''Milyen előnyei vannak a dependency injection használatának?'' | ||
*** separation of concerns | *** separation of concerns | ||
| 203. sor: | 210. sor: | ||
***** teljesen független a dependency életciklusa a komponensétől | ***** teljesen független a dependency életciklusa a komponensétől | ||
****** újrafelhasználható | ****** újrafelhasználható | ||
***** erősebb dekompozíció | ***** csak az injektornak kell ismernie a függőségi gráfot | ||
**** erősebb dekompozíció | |||
***** jobb tesztelhetőség | |||
***** a komponens kódja így rövidebb lesz | ***** a komponens kódja így rövidebb lesz | ||
**''Mire szolgál az Angular <code>[https://angular.dev/api/common/NgIf?tab=description ngIf]</code> direktívája?'' | **''Mire szolgál az Angular <code>[https://angular.dev/api/common/NgIf?tab=description ngIf]</code> direktívája?'' | ||
***elemek feltételes megjelenítésére | ***elemek feltételes megjelenítésére | ||
| 245. sor: | 252. sor: | ||
***Mi a <code>LayoutInflater</code> feladata? | ***Mi a <code>LayoutInflater</code> feladata? | ||
***Hogyan lehet elkészíteni és kezelni egy menüt? | ***Hogyan lehet elkészíteni és kezelni egy menüt? | ||
**12. hét | **12. hét | ||
***Mire használhatók a <code>Fragment</code>-ek? | ***Mire használhatók a <code>Fragment</code>-ek? | ||
| 255. sor: | 261. sor: | ||
***Hogyan támogatja az Android az adatok adatbázisban tárolását? | ***Hogyan támogatja az Android az adatok adatbázisban tárolását? | ||
***Sorolja fel az ORM alapelveit! | ***Sorolja fel az ORM alapelveit! | ||
**** | |||
{| class="wikitable" | |||
|+ | |||
!DB | |||
!code | |||
|- | |||
|table | |||
|class | |||
|- | |||
|column | |||
|field | |||
|- | |||
|row | |||
|object | |||
|} | |||
**** | |||
***Milyen lehetőségek vannak a fájlrendszerben való adattárolásra? | ***Milyen lehetőségek vannak a fájlrendszerben való adattárolásra? | ||
***Mire jó egy | ***Mire jó egy <code>ContentProvider</code>? | ||
***Milyen formában adja vissza az adatokat egy | ***Milyen formában adja vissza az adatokat egy <code>ContentProvider</code>? | ||
**13. hét | **13. hét | ||
***Mik a Jetpack Compose használatának előnyei? | ***Mik a Jetpack Compose használatának előnyei? | ||
| 266. sor: | 288. sor: | ||
***Mire használható a lazy loading? | ***Mire használható a lazy loading? | ||
***Mik azok a coroutine-ok? | ***Mik azok a coroutine-ok? | ||
** 14. hét | ** 14. hét | ||
***Milyen rövidtávú kommunikációs technológiákat ismer? | ***Milyen rövidtávú kommunikációs technológiákat ismer? | ||
| 281. sor: | 302. sor: | ||
*Vizsga | *Vizsga | ||
**''Hogyan tudunk saját stílust definiálni? Hogyan tudjuk ezt a stílust az egész alkalmazásra érvényesíteni?'' (kifejtős) | **''Hogyan tudunk saját stílust definiálni? Hogyan tudjuk ezt a stílust az egész alkalmazásra érvényesíteni?'' (kifejtős) | ||
***View | ***<code>View</code> | ||
****Saját stílust a <code>res/values/styles.xml</code> fájlban egy <code><style></code> tag, majd ez alatt további <code><item></code> tagek hozzáadásával lehet definiálni. | ****Saját stílust a <code>res/values/styles.xml</code> fájlban egy <code><style></code> tag, majd ez alatt további <code><item></code> tagek hozzáadásával lehet definiálni. | ||
****A manifest fájl <code><application></code> tagjébe kell felvenni egy <code>android:theme</code> attribútumként, pl. így: <code><application android:theme="@style/ | ****A manifest fájl <code><application></code> tagjébe kell felvenni egy <code>android:theme</code> attribútumként, pl. így: <code><application android:theme="@style/custom_style"></code>. | ||
***Jetpack Compose | ***Jetpack Compose | ||
****Saját stílust egy <code>@Composable</code> függvény (pl. <code>MyTheme</code>) létrehozásával lehet definiálni, melyben pl. a <code>MaterialTheme</code> függvényt az általunk választott paraméterekkel hívjuk meg. | ****Saját stílust egy <code>@Composable</code> függvény (pl. <code>MyTheme</code>) létrehozásával lehet definiálni, melyben pl. a <code>MaterialTheme</code> függvényt az általunk választott paraméterekkel hívjuk meg. | ||
****A <code>MainActivity</code> class <code>setContent</code> függvényében az <code>App</code> | ****A <code>MainActivity</code> class <code>setContent</code> függvényében az <code>App()</code> hívását a <code>MyTheme</code> függvény hívásába kell ágyazni. | ||
**''Mi a Fragment?'' (kifejtős) | **''Mi a Fragment?'' (kifejtős) | ||
***objektumok, melyek... | ***objektumok, melyek... | ||
| 296. sor: | 317. sor: | ||
****és / vagy a háttérben munkát végeznek | ****és / vagy a háttérben munkát végeznek | ||
**''Mire és hogyan használható egy flow?'' (kifejtős) | **''Mire és hogyan használható egy flow?'' (kifejtős) | ||
*** | ***egy Python generatorhoz vagy egy Java Streamhez hasonló változótípus | ||
**** | ****egy Python generatorhoz hasonlóan több visszatérési értéke is lehet | ||
**** | ****egy Java Streamhez hasonlóan lehet mapelni vagy filterezni | ||
*** | ***segítségével pl. fel lehet iratkozni egy adatfolyamra, hogy onnan folyamatosan kapjunk frissítéseket | ||
*** | ***egy <code>Flow<></code> típusú változó <code>.collect { }</code> függvényét meghívva egy lambda kifejezést lehet végrehajtani a kapott értékekkel | ||
**Ha <code>A</code> <code>Activity</code>-ről átváltunk a <code>B</code> <code>Activity</code>-re, milyen sorrendben hívódnak meg az életciklus callback függvények? | **Ha <code>A</code> <code>Activity</code>-ről átváltunk a <code>B</code> <code>Activity</code>-re, milyen sorrendben hívódnak meg az életciklus callback függvények? | ||
**#<code>A.onPause()</code> | **#<code>A.onPause()</code> | ||
| 317. sor: | 338. sor: | ||
var emailAddress = "klaf@aut.bme.hu" | var emailAddress = "klaf@aut.bme.hu" | ||
Column() { | Column( | ||
modifier = modifier.fillMaxSize(), | |||
horizontalAlignment = Alignment.CenterHorizontally, | |||
) { | |||
TextField( | TextField( | ||
placeholder = "Email", | placeholder = "Email", | ||
| 335. sor: | 359. sor: | ||
} | } | ||
</syntaxhighlight> | </syntaxhighlight> | ||
**[[Fájl:Kliens_vizsga3_20240617_the-lord-of-the-rings.svg|keret|jobbra|keretnélküli|332x332px]]''Vázolja fel a képen látható nézet kódját a '''View''' framework segítségével! A kódnak nem kell tökéletesnek és teljesnek lennie, de a lényegi részek szerepeljenek benne.'' | **[[Fájl:Kliens_vizsga3_20240617_the-lord-of-the-rings.svg|keret|jobbra|keretnélküli|332x332px]]''Vázolja fel a képen látható nézet kódját a '''<code>View</code>''' framework segítségével! A kódnak nem kell tökéletesnek és teljesnek lennie, de a lényegi részek szerepeljenek benne.'' | ||
***<syntaxhighlight lang="xml" line="1"> | ***<syntaxhighlight lang="xml" line="1"> | ||
<RelativeLayout | <RelativeLayout | ||
| 344. sor: | 368. sor: | ||
android:layout_width="wrap_content" | android:layout_width="wrap_content" | ||
android:layout_height="wrap_content" | android:layout_height="wrap_content" | ||
android:layout_centerHorizontal="true" | |||
android:layout_centerVertical="true" | android:layout_centerVertical="true" | ||
android:padding="16dp" /> | android:padding="16dp" /> | ||
<LinearLayout | <LinearLayout | ||
android:layout_width="wrap_content" | android:layout_width="wrap_content" | ||
android:layout_height="wrap_content" | android:layout_height="wrap_content" | ||
android:orientation="vertical" | android:orientation="vertical" | ||
android: | android:layout_centerHorizontal="true" | ||
android:background="#FFFFFF"> | android:background="#FFFFFF"> | ||
| 360. sor: | 384. sor: | ||
android:text="J. R. R. Tolkien" | android:text="J. R. R. Tolkien" | ||
android:textColor="#000000" | android:textColor="#000000" | ||
android:textSize="24sp | android:textSize="24sp" /> | ||
<TextView | <TextView | ||