From 20ddf7129b3cd5f671644118c75c7cba02042bb0 Mon Sep 17 00:00:00 2001 From: kpomazi Date: Thu, 22 Feb 2024 14:44:22 +0000 Subject: [PATCH] deploy: c987a2b4f10868d52b05d31a26e74fa9b62abab2 --- laborok/tictactoe/index.html | 142 ++++++++++++++++++----------------- search/search_index.json | 2 +- sitemap.xml | 36 ++++----- sitemap.xml.gz | Bin 209 -> 208 bytes 4 files changed, 94 insertions(+), 86 deletions(-) diff --git a/laborok/tictactoe/index.html b/laborok/tictactoe/index.html index 2eb27d5..5a38bfc 100644 --- a/laborok/tictactoe/index.html +++ b/laborok/tictactoe/index.html @@ -551,6 +551,13 @@ MainActivity felület + + +
  • + + ViewBinding + +
  • @@ -589,15 +596,15 @@
  • - - Alkalmazás ikon lecserélése + + Alkalmazás ikon lecserélése - Önálló feladat
  • - Játéklogika ellenőrzése - önálló feladat + Játéklogika ellenőrzése - Önálló feladat
  • @@ -892,6 +899,13 @@ MainActivity felület + + +
  • + + ViewBinding + +
  • @@ -930,15 +944,15 @@
  • - - Alkalmazás ikon lecserélése + + Alkalmazás ikon lecserélése - Önálló feladat
  • - Játéklogika ellenőrzése - önálló feladat + Játéklogika ellenőrzése - Önálló feladat
  • @@ -1149,59 +1163,9 @@

    MainActivity felület</androidx.constraintlayout.widget.ConstraintLayout>

    Nézzük át a laborvezetővel a felület felépítését!

    -

    Highscore gomb eseménykezelő

    -

    Az Eredmények menüpontra kattintva egy Toast üzenetet kell megjeleníteni. Ehhez meg kell keresni az Eredmények menüpont gombját és be kell állítani neki az alábbi eseménykezelőt a MainActivity onCreate() függvényén belül:

    -
    val btnHighScore = findViewById<Button>(R.id.btnHighScores)
    -btnHighScore.setOnClickListener {
    -    Toast.makeText(
    -        this@MainActivity,
    -        getString(R.string.toast_highscore),
    -        Toast.LENGTH_LONG
    -    ).show()
    -}
    -
    -
    -

    onClickListener

    -

    A setOnClickListener függvény valójában egy View.OnClickListener interfészt megvalósító objektumot vár paraméterként, amelynek egyetlen megvalósítandó függvénye van. Ezt létrehozhatnánk a Java-s anonim osztályok stílusában is, de helyette kihasználjuk, hogy a függvények elsőrendű tagjai a Kotlin nyelvnek, így rendelkezünk igazi függvény típusokkal. Jelen esetben a paraméterben egy olyan lambda kifejezést adunk át, amely fejléce megegyezik az elvárt interfész egyetlen függvényének fejlécével, a SAM conversion nyelvi funkció pedig a háttérben a lambda alapján létrehozza a megfelelő View.OnClickListener példányt.

    -
    -
    -

    BEADANDÓ (1 pont)

    -

    Készíts egy képernyőképet, amelyen látszik a highscores Toast üzenet (emulátoron, készüléket tükrözve vagy képernyőfelvétellel), a az ahhoz tartozó kódrészlet, valamint a neptun kódod a kódban valahol kommentként. A képet a megoldásban a repository-ba f1.png néven töltsd föl.

    -
    -

    AboutActivity felület

    -

    Ahogy korábban említettük, az Infó menü elindítja az AboutActivity-t. Elsőként készítsük el az AboutActivity felületét, melyet a res/layout/activity_about.xml ír le. Mint korábban, itt is lehet ConstraintLayout-ot készíteni a segítséggel, vagy alább megtalálható az XML:

    -

    -
    <?xml version="1.0" encoding="utf-8"?>
    -<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    -    xmlns:app="http://schemas.android.com/apk/res-auto"
    -    xmlns:tools="http://schemas.android.com/tools"
    -    android:layout_width="match_parent"
    -    android:layout_height="match_parent"
    -    tools:context=".AboutActivity"
    -    tools:viewBindingIgnore="true">
    -
    -    <TextView
    -        android:id="@+id/textView"
    -        android:layout_width="wrap_content"
    -        android:layout_height="wrap_content"
    -        android:layout_margin="8dp"
    -        android:text="@string/txt_about"
    -        android:textSize="32sp"
    -        app:layout_constraintBottom_toBottomOf="parent"
    -        app:layout_constraintEnd_toEndOf="parent"
    -        app:layout_constraintStart_toStartOf="parent"
    -        app:layout_constraintTop_toTopOf="parent" />
    -
    -</androidx.constraintlayout.widget.ConstraintLayout>
    -
    - -

    A következő lépésként valósítsuk meg a navigációt (váltást) az Activity-k között. Az Új játék menüpont hatására a GameActivity-re, az Infó menüpont hatására pedig az AboutActivity-re kell átváltanunk. Activity-k közti váltást egy Intent segítségével tudunk implementálni - beszéljük meg a laborvezetővel az Intent-ek alapjait. Ezt a témát előadáson később mélyebben fogjuk még érinteni.

    -

    Valósítsuk meg ezen két gomb eseménykezelőjét szintén a MainActivity onCreate() függvényében!

    -
    -

    findViewById

    -

    Ezt csinálhatnánk az előzőhöz hasonlóan, azaz példányosítunk egy gombot, a findViewById metódussal referenciát szerzünk a felületen lévő vezérlőre, és a példányon beállítjuk az eseménykezelőt. Azonban a findViewById hívásnak számos problémája van. Ezekről bővebben az előadáson lesz szó (pl.: Null safety, type safety). Ezért e helyett "nézetkötést", azaz ViewBinding-ot fogunk használni. +

    ViewBinding

    +

    A felületi elemeink elérésére "nézetkötést", azaz ViewBinding-ot fogunk használni. A ViewBinding a kódírást könnyíti meg számunkra. Amennyiben ezt használjuk, az automatikusan generálódó binding osztályokon keresztül közvetlen referencián keresztül tudunk elérni minden ID-val rendelkező erőforrást az XML fájljainkban.

    -

    Először is be kell kapcsolnunk a modulunkra a ViewBinding-ot. Az app modulhoz tartozó build.gradle.kts fájlban az android tagen belülre illesszük be az engedélyezést:

    android {
         ...
    @@ -1224,7 +1188,7 @@ 
    -

    Ezzel után már a teljes modulunkban automatikusan elérhetővé vált a ViewBinging. Használatához az Activity-nkben csak példányosítanunk kell a binding objektumot, amin keresztül majd elérhetjük az erőforrásainkat. +

    Ezzel után már a teljes modulunkban automatikusan elérhetővé vált a ViewBinding. Használatához az Activity-nkben csak példányosítanunk kell a binding objektumot, amin keresztül majd elérhetjük az erőforrásainkat. A binding példány működéséhez három dolgot kell tennünk:

    1. A generált binding osztály statikus inflate függvényével példányosítjuk a binding osztályunkat az Activity-hez,
    2. @@ -1251,7 +1215,8 @@

      Highscore gomb eseménykezelő

      +

      Az Eredmények menüpontra kattintva egy Toast üzenetet kell megjeleníteni. Ehhez meg kell keresni az Eredmények menüpont gombját és be kell állítani neki az alábbi eseménykezelőt a MainActivity onCreate() függvényén belül:

      binding.btnHighScores.setOnClickListener {
           Toast.makeText(
               this@MainActivity,
      @@ -1259,8 +1224,45 @@ 
      +
      +

      onClickListener

      +

      A setOnClickListener függvény valójában egy View.OnClickListener interfészt megvalósító objektumot vár paraméterként, amelynek egyetlen megvalósítandó függvénye van. Ezt létrehozhatnánk a Java-s anonim osztályok stílusában is, de helyette kihasználjuk, hogy a függvények elsőrendű tagjai a Kotlin nyelvnek, így rendelkezünk igazi függvény típusokkal. Jelen esetben a paraméterben egy olyan lambda kifejezést adunk át, amely fejléce megegyezik az elvárt interfész egyetlen függvényének fejlécével, a SAM conversion nyelvi funkció pedig a háttérben a lambda alapján létrehozza a megfelelő View.OnClickListener példányt.

      +
      +
      +

      BEADANDÓ (1 pont)

      +

      Készíts egy képernyőképet, amelyen látszik a highscores Toast üzenet (emulátoron, készüléket tükrözve vagy képernyőfelvétellel), a az ahhoz tartozó kódrészlet, valamint a neptun kódod a kódban valahol kommentként. A képet a megoldásban a repository-ba f1.png néven töltsd föl.

      +
      +

      AboutActivity felület

      +

      Ahogy korábban említettük, az Infó menü elindítja az AboutActivity-t. Elsőként készítsük el az AboutActivity felületét, melyet a res/layout/activity_about.xml ír le. Mint korábban, itt is lehet ConstraintLayout-ot készíteni a segítséggel, vagy alább megtalálható az XML:

      +

      +
      <?xml version="1.0" encoding="utf-8"?>
      +<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
      +    xmlns:app="http://schemas.android.com/apk/res-auto"
      +    xmlns:tools="http://schemas.android.com/tools"
      +    android:layout_width="match_parent"
      +    android:layout_height="match_parent"
      +    tools:context=".AboutActivity"
      +    tools:viewBindingIgnore="true">
       
      -binding.btnStart.setOnClickListener {
      +    <TextView
      +        android:id="@+id/textView"
      +        android:layout_width="wrap_content"
      +        android:layout_height="wrap_content"
      +        android:layout_margin="8dp"
      +        android:text="@string/txt_about"
      +        android:textSize="32sp"
      +        app:layout_constraintBottom_toBottomOf="parent"
      +        app:layout_constraintEnd_toEndOf="parent"
      +        app:layout_constraintStart_toStartOf="parent"
      +        app:layout_constraintTop_toTopOf="parent" />
      +
      +</androidx.constraintlayout.widget.ConstraintLayout>
      +
      + +

      A következő lépésként valósítsuk meg a navigációt (váltást) az Activity-k között. Az Új játék menüpont hatására a GameActivity-re, az Infó menüpont hatására pedig az AboutActivity-re kell átváltanunk. Activity-k közti váltást egy Intent segítségével tudunk implementálni - beszéljük meg a laborvezetővel az Intent-ek alapjait. Ezt a témát előadáson később mélyebben fogjuk még érinteni.

      +

      Valósítsuk meg ezen két gomb eseménykezelőjét szintén a MainActivity onCreate() függvényében!

      +
      binding.btnStart.setOnClickListener {
           startActivity(Intent(this@MainActivity, GameActivity::class.java))
       }
       
      @@ -1578,8 +1580,12 @@ 

      Játéktér kirajzolása } }

      -

      Alkalmazás ikon lecserélése

      -

      Az alkalmazás ikonját jelenleg a res/mipmap[-ldpi/mdpi/hdpi/xhdpi/...] mappákban található ic_launcher.png jelképezi. A laborvezető segítségével keressünk egy új ikont és cseréljük le. Nem muszáj az ikont minden felbontásban elkészíteni, egyszerűen elhelyezhetónk egy méretet a mipmap mappában is (melyet létre kell hozni), ekkor természetesen különböző felbontású eszközökön torzulhat az ikon képe. (Ha marad idő, a beépített Asset Studio-val elkészíthetjük az összes szükséges változatot.)

      +

      Alkalmazás ikon lecserélése - Önálló feladat

      +

      Az alkalmazás ikonját jelenleg a res/mipmap[-ldpi/mdpi/hdpi/xhdpi/...] mappákban található ic_launcher.png jelképezi. Keressünk egy új ikont és cseréljük le. Nem muszáj az ikont minden felbontásban elkészíteni, egyszerűen elhelyezhetónk egy méretet a mipmap mappában is (melyet létre kell hozni), ekkor természetesen különböző felbontású eszközökön torzulhat az ikon képe. (Ha marad idő, a beépített Asset Studio-val elkészíthetjük az összes szükséges változatot.)

      +
      +

      Ikon generálása

      +

      Ikon generálására használhatjuk például a következő oldalt: https://icon.kitchen/

      +

      Próbáljuk ki az alkalmazást!

      Észrevehetjük, hogy ha a játéktérről visszalépünk és megint új játékot kezdünk, a játéktér nem törlődik. Ezért a GameActivity-re való navigáció előtt a TicTacToeModel-t alapállapotba kell állítanunk, hogy új játék kezdődjön (MainActivity.kt):

      -

      Játéklogika ellenőrzése - önálló feladat

      +

      Játéklogika ellenőrzése - Önálló feladat

      Valósítson meg egy függvényt, mely minden lépés után leellenőrzi, hogy győzött-e valamelyik játékos, vagy nincs-e döntetlen. Amennyiben vége a játéknak, egy Toast üzenettel jelezze ezt a felhasználónak és lépjen vissza a főmenübe. A laborvezető segítségével vizsgálja meg, hogy a View osztályból hogyan érhető el az őt tartalmazó "host" Activity, aminek így például egy gameOver() függvénye meghívható, ami megvalósítja a fent leírt játék befejezést.

      Jó munkát kívánunk!

      @@ -1656,8 +1662,8 @@

      Játéklogika ellenőrzése - ö - - 2023-09-20 + + 2024-02-22 @@ -1672,7 +1678,9 @@

      Játéklogika ellenőrzése - ö Szerzők -