Canvas nesneleri üzerinde çizim yapma

Bu codelab, Advanced Android in Kotlin kursunun bir parçasıdır. Bu kurstan en iyi şekilde yararlanmak için codelab'leri sırayla incelemeniz önerilir ancak bu zorunlu değildir. Kursla ilgili tüm codelab'ler Kotlin'de İleri Düzey Android codelab'leri açılış sayfasında listelenir.

Giriş

Android'de, görünümlere özel 2D grafikler ve animasyonlar uygulamak için kullanabileceğiniz çeşitli teknikler vardır.

Çizilebilir öğeleri kullanmanın yanı sıra Canvas sınıfının çizim yöntemlerini kullanarak 2D çizimler oluşturabilirsiniz. Canvas, çizim yöntemleri sunan bir 2D çizim yüzeyidir. Bu, uygulamanızın düzenli olarak kendini yeniden çizmesi gerektiğinde (kullanıcının gördüğü içerik zaman içinde değiştiği için) yararlıdır. Bu codelab'de, View içinde gösterilen bir tuval oluşturmayı ve tuval üzerinde çizim yapmayı öğreneceksiniz.

Bir tuval üzerinde gerçekleştirebileceğiniz işlem türleri şunlardır:

  • Tüm tuvali renkle doldurun.
  • Paint nesnesinde tanımlandığı şekilde stilize edilmiş dikdörtgenler, yaylar ve yollar gibi şekiller çizin. Paint nesnesi, geometrilerin (ör. çizgi, dikdörtgen, oval ve yollar) nasıl çizileceği veya metnin yazı tipi gibi stil ve renk bilgilerini içerir.
  • Çeviri, ölçeklendirme veya özel dönüşümler gibi dönüşümler uygulayın.
  • Kırpma: Tuvalin görünür kısımlarını tanımlamak için tuvale bir şekil veya yol uygulama.

Android çizimini nasıl düşünebilirsiniz? (Çok basitleştirilmiş!)

Android'de veya diğer modern sistemlerde çizim yapmak, donanıma kadar soyutlama katmanları ve optimizasyonlar içeren karmaşık bir süreçtir. Android'in nasıl çizim yaptığı, hakkında çok şey yazılmış büyüleyici bir konudur ve ayrıntıları bu codelab'in kapsamı dışındadır.

Bu codelab ve tam ekran görünümünde görüntülemek için tuvalden yararlanan uygulaması bağlamında, bunu aşağıdaki şekilde düşünebilirsiniz.

  1. Çizdiğiniz öğeleri görüntülemek için bir görünüme ihtiyacınız vardır. Bu, Android sistemi tarafından sağlanan görünümlerden biri olabilir. Alternatif olarak, bu codelab'de uygulamanızın içerik görünümü olarak hizmet veren özel bir görünüm oluşturursunuz (MyCanvasView).
  2. Tüm görünümler gibi bu görünüm de kendi tuvaliyle (canvas) birlikte gelir.
  3. Bir görünümün tuvaline çizim yapmanın en temel yolu, görünümün onDraw() yöntemini geçersiz kılmak ve tuvaline çizim yapmaktır.
  4. Çizim yaparken daha önce çizdiklerinizi önbelleğe almanız gerekir. Verilerinizi önbelleğe almanın çeşitli yolları vardır. Bunlardan biri, verilerinizi bit eşlem olarak önbelleğe almaktır (extraBitmap). Diğeri ise çizdiklerinizi koordinatlar ve talimatlar olarak kaydetmektir.
  5. Tuval çizim API'sini kullanarak önbelleğe alma bit eşleminize (extraBitmap) çizim yapmak için önbelleğe alma bit eşleminiz için bir önbelleğe alma tuvali (extraCanvas) oluşturursunuz.
  6. Ardından, önbelleğe alma tuvalinize (extraCanvas) çizim yaparsınız. Bu çizim, önbelleğe alma bit eşleminize (extraBitmap) aktarılır.
  7. Ekranda çizilen her şeyi göstermek için görünümün tuvaline (canvas) önbelleğe alınan bit eşlemi (extraBitmap) çizmesini söylersiniz.

Bilmeniz gerekenler

  • Etkinlik ve temel düzen içeren bir uygulama oluşturup Android Studio'yu kullanarak çalıştırma
  • Etkinlik işleyicileri görünümlerle ilişkilendirme
  • Özel görünüm oluşturma

Neler öğreneceksiniz?

  • Canvas oluşturma ve kullanıcı dokunuşuna yanıt olarak üzerine çizme

Yapacaklarınız

  • Kullanıcının ekrana dokunmasına yanıt olarak ekranda çizgiler çizen bir uygulama oluşturun.
  • Hareket etkinliklerini yakalayın ve yanıt olarak ekranda tam ekran özel görünümde gösterilen bir tuval üzerinde çizgiler çizin.

MiniPaint uygulaması, kullanıcının dokunmalarına yanıt olarak bir çizgi göstermek için özel bir görünüm kullanır. Bu durum, aşağıdaki ekran görüntüsünde gösterilmiştir.

1. Adım: MiniPaint projesini oluşturma

  1. Empty Activity şablonunu kullanan MiniPaint adlı yeni bir Kotlin projesi oluşturun.
  2. app/res/values/colors.xml dosyasını açın ve aşağıdaki iki rengi ekleyin.
<color name="colorBackground">#FFFF5500</color>
<color name="colorPaint">#FFFFEB3B</color>
  1. styles.xml uygulamasını aç
  2. Belirtilen AppTheme stilinin üst öğesinde DarkActionBar değerini NoActionBar ile değiştirin. Bu işlem, tam ekran çizim yapabilmeniz için işlem çubuğunu kaldırır.
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">

2. adım: MyCanvasView sınıfını oluşturma

Bu adımda, çizim için özel bir görünüm, MyCanvasView, oluşturursunuz.

  1. app/java/com.example.android.minipaint paketinde New > Kotlin File/Class'ı (Yeni > Kotlin Dosyası/Sınıfı) tıklayarak MyCanvasView adlı bir dosya oluşturun.
  2. MyCanvasView sınıfının View sınıfını genişletmesini ve context: Context'yi iletmesini sağlayın. Önerilen içe aktarmaları kabul edin.
import android.content.Context
import android.view.View

class MyCanvasView(context: Context) : View(context) {
}

3. Adım: MyCanvasView'ı içerik görünümü olarak ayarlama

MyCanvasView içine çizeceklerinizi göstermek için MyCanvasView'yı MainActivity'nin içerik görünümü olarak ayarlamanız gerekir.

  1. strings.xml dosyasını açın ve görünümün içerik açıklamasında kullanılacak bir dize tanımlayın.
<string name="canvasContentDescription">Mini Paint is a simple line drawing app.
   Drag your fingers to draw. Rotate the phone to clear.</string>
  1. MainActivity.kt uygulamasını aç
  2. onCreate() bölümünde setContentView(R.layout.activity_main) öğesini silin.
  3. MyCanvasView örneği oluşturun. 
val myCanvasView = MyCanvasView(this)
  1. Bunun altında, myCanvasView düzeni için tam ekran isteğinde bulunun. Bunu, SYSTEM_UI_FLAG_FULLSCREEN işaretini myCanvasView üzerinde ayarlayarak yapabilirsiniz. Bu şekilde, görünüm ekranı tamamen doldurur.
myCanvasView.systemUiVisibility = SYSTEM_UI_FLAG_FULLSCREEN
  1. İçerik açıklaması ekleyin. 
myCanvasView.contentDescription = getString(R.string.canvasContentDescription)
  1. Bunun altında, içerik görünümünü myCanvasView olarak ayarlayın. 
setContentView(myCanvasView)
  1. Uygulamanızı çalıştırın. Tuvalin boyutu olmadığı ve henüz hiçbir şey çizmediğiniz için tamamen beyaz bir ekran görürsünüz.

1. Adım: onSizeChanged() işlevini geçersiz kılma

onSizeChanged() yöntemi, bir görünümün boyutu her değiştiğinde Android sistemi tarafından çağrılır. Görünüm boyutu olmadan başladığı için görünümün onSizeChanged() yöntemi de Etkinlik tarafından oluşturulup şişirildikten sonra çağrılır. Bu nedenle, onSizeChanged() yöntemi, görünümün kanvasını oluşturmak ve ayarlamak için ideal yerdir.

  1. MyCanvasView içinde, sınıf düzeyinde bir tuval ve bir bit eşlem için değişkenler tanımlayın. Bu kişileri extraCanvas ve extraBitmap olarak adlandırın. Bunlar, daha önce çizilenleri önbelleğe almak için kullanılan bit eşlem ve tuvaldir.
private lateinit var extraCanvas: Canvas
private lateinit var extraBitmap: Bitmap
  1. Tuvalin arka plan rengi için backgroundColor sınıf düzeyinde bir değişken tanımlayın ve bunu daha önce tanımladığınız colorBackground ile başlatın.
private val backgroundColor = ResourcesCompat.getColor(resources, R.color.colorBackground, null)
  1. MyCanvasView içinde onSizeChanged() yöntemini geçersiz kılın. Bu geri çağırma yöntemi, Android sistemi tarafından değiştirilen ekran boyutlarıyla (yani yeni bir genişlik ve yükseklik ile (değiştirilecek) ve eski genişlik ve yükseklik ile (değiştirilecek)) çağrılır.
override fun onSizeChanged(width: Int, height: Int, oldWidth: Int, oldHeight: Int) {
   super.onSizeChanged(width, height, oldWidth, oldHeight)
}
  1. onSizeChanged() içinde, ekran boyutu olan yeni genişlik ve yükseklikle Bitmap örneği oluşturun ve bunu extraBitmap'ye atayın. Üçüncü bağımsız değişken, bit eşlem renk yapılandırmasıdır. ARGB_8888 her rengi 4 bayt olarak depolar ve önerilir.
extraBitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888)
  1. extraBitmap öğesinden Canvas örneği oluşturun ve extraCanvas öğesine atayın. 
 extraCanvas = Canvas(extraBitmap)
  1. extraCanvas öğesinin doldurulacağı arka plan rengini belirtin. 
extraCanvas.drawColor(backgroundColor)
  1. onSizeChanged()'ya baktığımızda, işlev her yürütüldüğünde yeni bir bit eşlem ve tuval oluşturulur. Boyut değiştiğinden yeni bir bit eşlem gerekir. Ancak bu, eski bit eşlemleri ortada bırakan bir bellek sızıntısıdır. Bu sorunu düzeltmek için extraBitmap çağrısından hemen sonra bu kodu ekleyerek bir sonraki extraBitmap öğesini oluşturmadan önce extraBitmap öğesini geri dönüştürün.super
if (::extraBitmap.isInitialized) extraBitmap.recycle()

2. adım: onDraw() işlevini geçersiz kılma

MyCanvasView ile ilgili tüm çizim çalışmaları onDraw() içinde yapılır.

Başlamak için ekranı onSizeChanged() bölümünde ayarladığınız arka plan rengiyle doldurarak tuvali gösterin.

  1. onDraw() değerini geçersiz kılın ve görünümle ilişkili tuvalde, önbelleğe alınmış extraBitmap öğesinin içeriklerini çizin. drawBitmap() Canvas yöntemi çeşitli sürümlerde sunulur. Bu kodda, bit eşlemi, sol üst köşenin x ve y koordinatlarını (piksel cinsinden) ve null için Paint değerini sağlarsınız. Bu değeri daha sonra ayarlarsınız.
override fun onDraw(canvas: Canvas) {
   super.onDraw(canvas)
canvas.drawBitmap(extraBitmap, 0f, 0f, null)
}


onDraw()'a iletilen ve sistem tarafından bit eşlemi göstermek için kullanılan tuvalin, onSizeChanged() yönteminde oluşturduğunuz ve bit eşleme çizmek için kullandığınız tuvalden farklı olduğunu unutmayın.

  1. Uygulamanızı çalıştırın. Ekranın tamamının belirtilen arka plan rengiyle dolduğunu görmelisiniz.

Çizim yapmak için, çizim sırasında öğelerin nasıl stilize edileceğini belirten bir Paint nesnesi ve neyin çizileceğini belirten bir Path nesnesi gerekir.

1. Adım: Paint nesnesi başlatma

  1. MyCanvasView.kt dosyasında, en üst düzey dosya seviyesinde fırça genişliği için bir sabit tanımlayın. 
private const val STROKE_WIDTH = 12f // has to be float
  1. MyCanvasView sınıf düzeyinde, çizilecek rengi tutmak için drawColor değişkenini tanımlayın ve daha önce tanımladığınız colorPaint kaynağıyla başlatın. 
private val drawColor = ResourcesCompat.getColor(resources, R.color.colorPaint, null)
  1. Sınıf düzeyinde, aşağıda, Paint nesnesi için bir paint değişkeni ekleyin ve aşağıdaki gibi başlatın.
// Set up the paint with which to draw.
private val paint = Paint().apply {
   color = drawColor
   // Smooths out edges of what is drawn without affecting shape.
   isAntiAlias = true
   // Dithering affects how colors with higher-precision than the device are down-sampled.
   isDither = true
   style = Paint.Style.STROKE // default: FILL
   strokeJoin = Paint.Join.ROUND // default: MITER
   strokeCap = Paint.Cap.ROUND // default: BUTT
   strokeWidth = STROKE_WIDTH // default: Hairline-width (really thin)
}
  • paint öğesinin color, daha önce tanımladığınız drawColor'dir.
  • isAntiAlias kenar yumuşatma uygulanıp uygulanmayacağını tanımlar. isAntiAlias değerini true olarak ayarladığınızda, şekli etkilemeden çizilen öğelerin kenarları düzeltilir.
  • isDither, true olduğunda cihazdan daha yüksek hassasiyete sahip renklerin nasıl alt örnekleme yapılacağını etkiler. Örneğin, titretme, görüntülerin renk aralığını 256 (veya daha az) renge düşürmenin en yaygın yoludur.
  • style, temelde bir çizgi olan kontura yapılacak boyama türünü ayarlar. Paint.Style, çizilen öğenin doldurulup doldurulmadığını, konturlanıp konturlanmadığını veya her ikisinin de (aynı renkte) yapılıp yapılmadığını belirtir. Varsayılan olarak, boyanın uygulandığı nesne doldurulur. ("Dolguda" şeklin içi renklendirilirken "konturda" şeklin dış çizgisi renklendirilir.)
  • Paint.Join strokeJoin, çizgilerin ve eğri parçalarının konturlu bir yolda nasıl birleştiğini belirtir. Varsayılan değer MITER'dir.
  • strokeCap, çizginin ucunun şeklini kapak olarak ayarlar. Paint.Cap, konturlu çizgilerin ve yolların başlangıç ve bitiş noktalarını belirtir. Varsayılan değer BUTT'dir.
  • strokeWidth, konturun genişliğini piksel cinsinden belirtir. Varsayılan olarak kıl payı genişlik kullanılır. Bu genişlik çok ince olduğundan daha önce tanımladığınız STROKE_WIDTH sabiti kullanılır.

2. adım: Path nesnesi başlatma

Path, kullanıcının çizdiği öğenin yoludur.

  1. MyCanvasView içinde, kullanıcının ekrana dokunması takip edilirken çizilen yolu depolamak için bir path değişkeni ekleyin ve bunu bir Path nesnesiyle başlatın. Path için android.graphics.Path verilerini içe aktarın. 
private var path = Path()

1. Adım: Ekranda harekete yanıt verme

Kullanıcı ekrana her dokunduğunda görünümdeki onTouchEvent() yöntemi çağrılır.

  1. MyCanvasView içinde, iletilen event öğesinin x ve y koordinatlarını önbelleğe almak için onTouchEvent() yöntemini geçersiz kılın. Ardından, ekrana dokunma, ekranda hareket etme ve ekrandaki dokunmayı bırakma gibi hareket etkinliklerini işlemek için when ifadesini kullanın. Bunlar, ekranda çizgi çizmek için kullanılan ilgi çekici etkinliklerdir. Her etkinlik türü için aşağıdaki kodda gösterildiği gibi bir yardımcı program yöntemi çağırın. Dokunma etkinliklerinin tam listesi için MotionEvent sınıfı belgelerine bakın.
override fun onTouchEvent(event: MotionEvent): Boolean {
   motionTouchEventX = event.x
   motionTouchEventY = event.y

   when (event.action) {
       MotionEvent.ACTION_DOWN -> touchStart()
       MotionEvent.ACTION_MOVE -> touchMove()
       MotionEvent.ACTION_UP -> touchUp()
   }
   return true
}
  1. Sınıf düzeyinde, mevcut dokunma etkinliğinin x ve y koordinatlarını (MotionEvent koordinatları) önbelleğe almak için eksik motionTouchEventX ve motionTouchEventY değişkenlerini ekleyin. Bunları 0f olarak başlatın.
private var motionTouchEventX = 0f
private var motionTouchEventY = 0f
  1. touchStart(), touchMove() ve touchUp() olmak üzere üç işlev için sap oluşturun.
private fun touchStart() {}

private fun touchMove() {}

private fun touchUp() {}
  1. Kodunuz oluşturulup çalıştırılmalıdır ancak henüz renkli arka plandan farklı bir şey görmezsiniz.

2. adım: touchStart() işlevini uygulama

Bu yöntem, kullanıcı ekrana ilk kez dokunduğunda çağrılır.

  1. Sınıf düzeyinde, en son x ve y değerlerini önbelleğe almak için değişkenler ekleyin. Kullanıcı hareket etmeyi bıraktıktan ve dokunuşunu kaldırdıktan sonra bunlar, bir sonraki yolun (çizilecek çizginin bir sonraki segmenti) başlangıç noktası olur.
private var currentX = 0f
private var currentY = 0f
  1. touchStart() yöntemini aşağıdaki şekilde uygulayın. path değerini sıfırlayın, dokunma etkinliğinin x-y koordinatlarına (motionTouchEventX ve motionTouchEventY) gidin ve currentX ile currentY değerlerini atayın.
private fun touchStart() {
   path.reset()
   path.moveTo(motionTouchEventX, motionTouchEventY)
   currentX = motionTouchEventX
   currentY = motionTouchEventY
}

3. Adım: touchMove() işlevini uygulama

  1. Sınıf düzeyinde bir touchTolerance değişkeni ekleyin ve ViewConfiguration.get(context).scaledTouchSlop olarak ayarlayın.
private val touchTolerance = ViewConfiguration.get(context).scaledTouchSlop

Yol kullanıldığında her pikseli çizmeye ve her seferinde ekranın yenilenmesini istemeye gerek yoktur. Bunun yerine, çok daha iyi performans için noktalar arasında bir yol enterpolasyonu yapabilirsiniz (ve yapacaksınız).

  • Parmak çok az hareket ettiyse çizim yapmanıza gerek yoktur.
  • Parmak touchTolerance mesafesinden daha az hareket ettiyse çizim yapmayın.
  • scaledTouchSlop, kullanıcının kaydırdığını düşünmeden önce dokunmanın kaç piksel hareket edebileceğini gösterir.
  1. touchMove() yöntemini tanımlayın. Gidilen mesafeyi (dx, dy) hesaplayın, iki nokta arasında bir eğri oluşturup path'de saklayın, devam eden currentX ve currentY toplamını güncelleyin ve path'yi çizin. Ardından, güncellenen path ile ekranın yeniden çizilmesini zorlamak için invalidate() numaralı telefonu arayın.
private fun touchMove() {
   val dx = Math.abs(motionTouchEventX - currentX)
   val dy = Math.abs(motionTouchEventY - currentY)
   if (dx >= touchTolerance || dy >= touchTolerance) {
       // QuadTo() adds a quadratic bezier from the last point,
       // approaching control point (x1,y1), and ending at (x2,y2).
       path.quadTo(currentX, currentY, (motionTouchEventX + currentX) / 2, (motionTouchEventY + currentY) / 2)
       currentX = motionTouchEventX
       currentY = motionTouchEventY
       // Draw the path in the extra bitmap to cache it.
       extraCanvas.drawPath(path, paint)
   }
   invalidate()
}

Bu yöntemle ilgili daha ayrıntılı bilgi:

  1. Hareket edilen mesafeyi (dx, dy) hesaplayın.
  2. Hareket, dokunma toleransından daha fazlaysa yola bir segment ekleyin.
  3. Bir sonraki segmentin başlangıç noktasını bu segmentin bitiş noktası olarak ayarlayın.
  4. lineTo() yerine quadTo() kullanmak, köşesiz düzgün bir çizgi oluşturur. Bezier Eğrileri başlıklı makaleyi inceleyin.
  5. Görünümü (sonunda onDraw()'ı çağırarak) yeniden çizmek için invalidate()'ı çağırın.

4. adım: touchUp() işlevini uygulayın

Kullanıcı dokunuşunu kaldırdığında, yolun tekrar çizilmemesi için sıfırlanması yeterlidir. Hiçbir şey çizilmediği için geçersiz kılma işlemi gerekmez.

  1. touchUp() yöntemini uygulayın. 
private fun touchUp() {
   // Reset the path so it doesn't get drawn again.
   path.reset()
}
  1. Kodunuzu çalıştırın ve parmağınızı kullanarak ekranda çizim yapın. Cihazı döndürdüğünüzde çizim durumu kaydedilmediği için ekranın temizlendiğini unutmayın. Bu örnek uygulamada, kullanıcının ekranı temizlemesi için basit bir yöntem sunmak amacıyla bu şekilde tasarlanmıştır.

5. adım: Çizimin etrafına çerçeve çizin

Kullanıcı ekranda çizim yaparken uygulamanız yolu oluşturur ve bit eşlem extraBitmap olarak kaydeder. onDraw() yöntemi, görünümün tuvalinde ek bit eşlemi gösterir. onDraw() içinde daha fazla çizim yapabilirsiniz. Örneğin, bit eşlemi çizdikten sonra şekiller çizebilirsiniz.

Bu adımda, resmin kenarı etrafında bir çerçeve çizersiniz.

  1. MyCanvasView içinde, Rect nesnesi içeren frame adlı bir değişken ekleyin.
private lateinit var frame: Rect
  1. onSizeChanged() öğesinin sonunda bir iç kenar tanımlayın ve yeni boyutları ve iç kenarı kullanarak çerçeve için kullanılacak Rect öğesini oluşturacak kodu ekleyin.
// Calculate a rectangular frame around the picture.
val inset = 40
frame = Rect(inset, inset, width - inset, height - inset)
  1. onDraw() bölümünde, bit eşlemi çizdikten sonra bir dikdörtgen çizin.
// Draw a frame around the canvas.
canvas.drawRect(frame, paint)
  1. Uygulamanızı çalıştırın. Çerçeveye dikkat edin.

Görev (isteğe bağlı): Verileri bir Path'te depolama

Mevcut uygulamada çizim bilgileri bir bit eşlemde saklanır. Bu iyi bir çözüm olsa da çizim bilgilerini depolamanın tek yolu değildir. Çizim geçmişinizi nasıl saklayacağınız uygulamaya ve çeşitli gereksinimlerinize bağlıdır. Örneğin, şekil çiziyorsanız şekillerin konum ve boyutlarını içeren bir liste kaydedebilirsiniz. MiniPaint uygulamasında yolu Path olarak kaydedebilirsiniz. Denemek isterseniz bunu nasıl yapacağınızla ilgili genel bilgileri aşağıda bulabilirsiniz.

  1. MyCanvasView içinde extraCanvas ve extraBitmap ile ilgili tüm kodları kaldırın.
  2. Şu ana kadarki yol ve şu anda çizilen yol için değişkenler ekleyin.
// Path representing the drawing so far
private val drawing = Path()

// Path representing what's currently being drawn
private val curPath = Path()
  1. onDraw() içinde, bit eşlemi çizmek yerine depolanan ve geçerli yolları çizin. 
// Draw the drawing so far
canvas.drawPath(drawing, paint)
// Draw any current squiggle
canvas.drawPath(curPath, paint)
// Draw a frame around the canvas
canvas.drawRect(frame, paint)
  1. touchUp() içinde, geçerli yolu önceki yola ekleyin ve geçerli yolu sıfırlayın.
// Add the current path to the drawing so far
drawing.addPath(curPath)
// Rewind the current path for the next touch
curPath.reset()
  1. Uygulamanızı çalıştırın. Evet, hiçbir fark olmamalıdır.

Tamamlanmış codelab'in kodunu indirin.

$  git clone https://github.com/googlecodelabs/android-kotlin-drawing-canvas


Alternatif olarak, depoyu Zip dosyası olarak indirebilir, dosyayı açıp Android Studio'da açabilirsiniz.

Zip dosyasını indir
  • Canvas, çizim yöntemleri sunan 2 boyutlu bir çizim yüzeyidir.
  • Canvas, kendisini görüntüleyen bir View örneğiyle ilişkilendirilebilir.
  • Paint nesnesi, geometrilerin (ör. çizgi, dikdörtgen, oval ve yollar) ve metnin nasıl çizileceğiyle ilgili stil ve renk bilgilerini içerir.
  • Bir tuvalle çalışırken yaygın olarak kullanılan yöntem, özel bir görünüm oluşturup onDraw() ve onSizeChanged() yöntemlerini geçersiz kılmaktır.
  • Kullanıcı dokunuşlarını yakalamak ve bir şeyler çizerek bunlara yanıt vermek için onTouchEvent() yöntemini geçersiz kılın.
  • Zaman içinde değişen çizimlerle ilgili bilgileri önbelleğe almak için ek bir bit eşlem kullanabilirsiniz. Alternatif olarak şekilleri veya bir yolu da saklayabilirsiniz.

Udacity kursu:

Android geliştirici belgeleri:

Bu bölümde, bir eğitmenin yönettiği kurs kapsamında bu codelab'i tamamlayan öğrenciler için olası ödevler listelenmektedir. Eğitmen, aşağıdakileri yapmalıdır:

  • Gerekirse ödev atayın.
  • Öğrencilere ev ödevi ödevlerini nasıl göndereceklerini bildirin.
  • Ödevlere not verin.

Eğitmenler bu önerileri istedikleri kadar kullanabilir ve uygun olduğunu düşündükleri diğer ödevleri verebilirler.

Bu codelab'i kendi başınıza tamamlıyorsanız bilginizi test etmek için bu ödevleri kullanabilirsiniz.

Bu soruları yanıtlayın

1. Soru

Aşağıdaki bileşenlerden hangileri Canvas ile çalışmak için gereklidir? Uygun olan tüm seçenekleri işaretleyin.

▢ Bitmap

▢ Paint

▢ Path

▢ View

2. Soru

invalidate()'a yapılan çağrı (genel olarak) ne işe yarar?

▢ Uygulamanızı geçersiz kılar ve yeniden başlatır.

▢ Çizimi bit eşlemden siler.

▢ Önceki kodun çalıştırılmaması gerektiğini gösterir.

▢ Sisteme ekranı yeniden çizmesi gerektiğini bildirir.

3. Soru

Canvas, Bitmap ve Paint nesnelerinin işlevi nedir?

▢ 2D çizim yüzeyi, ekranda gösterilen bit eşlem, çizim için stil bilgileri.

▢ 3D çizim yüzeyi, yolu önbelleğe almak için bit eşlem, çizim için stil bilgileri.

▢ 2D çizim yüzeyi, ekranda gösterilen bit eşlem, görünüm için stil.

▢ Çizim bilgileri için önbellek, üzerine çizilecek bit eşlem, çizim için stil bilgileri.

Bu kurstaki diğer codelab'lerin bağlantıları için Advanced Android in Kotlin codelab'lerinin açılış sayfasına bakın.