„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>, content provider, <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)
*[[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 (i18n); UI: <code>viewBinding</code>; dpi, dp, sp; <code>LinearLayout</code>, <code>RelativeLayout</code>, <code>ConstraintLayout</code>; padding és margin
*[[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; '''content provider:''' elérése (<code>CONTENT_URI</code>), műveletek, engedélyek, <code>Cursor</code>, <code>ContentResolver</code>, CRUD
*[[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, context: ClassMethodDecoratorContext) {
function logged(originalMethod: any) {
     return (...args: any[]) => {
     try {
         try {
         console.log("Calculation started...");
            console.log("Calculation started...");
        return (...args: any[]) => originalMethod.call(this, ...args);
            return originalMethod.call(this, ...args);
    }
        }
    finally {
        finally {
        console.log("...finished!");
            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-1, 22);
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], de a TypeScript fordításidőben jelzi a típusokkal kapcsolatos problémákat (Pythonban ezeket csak az IDE mutatja)
***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
****** jobb tesztelhetőség
**** erősebb dekompozíció
***** jobb tesztelhetőség
***** a komponens kódja így rövidebb lesz
***** a komponens kódja így rövidebb lesz
**** csak az injektornak kell ismernie a függőségi gráfot
**''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?
***Hogyan adható meg, hogy egy stílus az egész alkalmazásra érvényes legyen?
**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 content provider?
***Mire jó egy <code>ContentProvider</code>?
***Milyen formában adja vissza az adatokat egy content provider?
***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?
***Mire való a flow, és hogyan használjuk?
** 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/CustomStyle"></code>.
****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> függvény hívását a <code>MyTheme</code> függvény hívásába kell ágyazni.
****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)  
***A flow egy Python generatorhoz vagy egy Java Streamhez hasonló változótípus.
***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 Python generatorhoz hasonlóan több visszatérési értéke is lehet
****Egy Java Streamhez hasonlóan lehet mapelni vagy filterezni.
****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.
***segítségével pl. fel lehet iratkozni egy adatfolyamra, hogy onnan folyamatosan kapjunk frissítéseket
***A <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ékkel.
***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_toEndOf="@id/one_ring_image"
         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:layout_centerVertical="true"
         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" />
            android:layout_marginBottom="8dp" />
          
          
         <TextView
         <TextView
A lap eredeti címe: „https://vik.wiki/Kliensalkalmazások