Skip to main content

Posts

Showing posts with the label Compose Canvas

jetpack compose - Draw text on canvas

MainActivity.kt package com.cfsuman.jetpackcompose import android.graphics.Paint import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import androidx.activity.compose.setContent import androidx.compose.foundation.Canvas import androidx.compose.foundation.background import androidx.compose.foundation.layout.* import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.nativeCanvas import androidx.compose.ui.graphics.toArgb import androidx.compose.ui.tooling.preview.Preview class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { MainContent() } } @Composable fun MainContent(){ Canvas( modifier = Modifier .fillMaxSize() .background(Color(0xFFE6E6FA)) ) { ...
Read more

jetpack compose - Draw image on canvas

MainActivity.kt package com.cfsuman.jetpackcompose import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import androidx.activity.compose.setContent import androidx.compose.foundation.Canvas import androidx.compose.foundation.background import androidx.compose.foundation.layout.* import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.geometry.Offset import androidx.compose.ui.graphics.* import androidx.compose.ui.res.imageResource import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { MainContent() } } @Composable fun MainContent(){ Canvas( modifier = Modifier .fillMaxSize() .background(Color(0xFFA17A74)) ) { ...
Read more

jetpack compose - Draw arc on canvas

MainActivity.kt package com.cfsuman.jetpackcompose import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import androidx.activity.compose.setContent import androidx.compose.foundation.Canvas import androidx.compose.foundation.background import androidx.compose.foundation.layout.* import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.geometry.Offset import androidx.compose.ui.graphics.* import androidx.compose.ui.graphics.drawscope.Stroke import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { MainContent() } } @Composable fun MainContent(){ Canvas( modifier = Modifier .fillMaxSize() .background(Color(0xFFDA8A67)) ) ...
Read more

jetpack compose - Canvas inset

MainActivity.kt package com.cfsuman.jetpackcompose import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import androidx.activity.compose.setContent import androidx.compose.foundation.Canvas import androidx.compose.foundation.background import androidx.compose.foundation.layout.* import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.geometry.Offset import androidx.compose.ui.geometry.Size import androidx.compose.ui.graphics.* import androidx.compose.ui.graphics.drawscope.inset import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { MainContent() } } @Composable fun MainContent(){ Canvas( modifier = Modifier .fillMaxSize() .backgro...
Read more

jetpack compose - Canvas withTransform

MainActivity.kt package com.cfsuman.jetpackcompose import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import androidx.activity.compose.setContent import androidx.compose.foundation.Canvas import androidx.compose.foundation.background import androidx.compose.foundation.layout.* import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.geometry.Offset import androidx.compose.ui.geometry.Size import androidx.compose.ui.graphics.* import androidx.compose.ui.graphics.drawscope.withTransform import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { MainContent() } } @Composable fun MainContent(){ Canvas( modifier = Modifier .fillMaxSize() ...
Read more

jetpack compose - Rotate canvas

MainActivity.kt package com.cfsuman.jetpackcompose import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import androidx.activity.compose.setContent import androidx.compose.foundation.Canvas import androidx.compose.foundation.background import androidx.compose.foundation.layout.* import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.geometry.Offset import androidx.compose.ui.geometry.Size import androidx.compose.ui.graphics.* import androidx.compose.ui.graphics.drawscope.rotate import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { MainContent() } } @Composable fun MainContent(){ Canvas( modifier = Modifier .fillMaxSize() .backgr...
Read more

jetpack compose - Draw oval on canvas

MainActivity.kt package com.cfsuman.jetpackcompose import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import androidx.activity.compose.setContent import androidx.compose.foundation.Canvas import androidx.compose.foundation.background import androidx.compose.foundation.layout.* import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.geometry.Offset import androidx.compose.ui.geometry.Size import androidx.compose.ui.graphics.* import androidx.compose.ui.graphics.drawscope.Stroke import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { MainContent() } } @Composable fun MainContent(){ Canvas( modifier = Modifier .fillMaxSize() .backgr...
Read more

jetpack compose - Draw rounded rectangle on canvas

MainActivity.kt package com.cfsuman.jetpackcompose import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import androidx.activity.compose.setContent import androidx.compose.foundation.Canvas import androidx.compose.foundation.background import androidx.compose.foundation.layout.* import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.geometry.CornerRadius import androidx.compose.ui.geometry.Offset import androidx.compose.ui.geometry.Size import androidx.compose.ui.graphics.* import androidx.compose.ui.graphics.drawscope.Stroke import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { MainContent() } } @Composable fun MainContent(){ Canvas( modifier = Modifier ...
Read more

jetpack compose - Draw rectangle on canvas

MainActivity.kt package com.cfsuman.jetpackcompose import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import androidx.activity.compose.setContent import androidx.compose.foundation.Canvas import androidx.compose.foundation.background import androidx.compose.foundation.layout.* import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.geometry.Offset import androidx.compose.ui.geometry.Size import androidx.compose.ui.graphics.* import androidx.compose.ui.graphics.drawscope.Stroke import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { MainContent() } } @Composable fun MainContent(){ Canvas( modifier = Modifier .fillMaxSize() .backgr...
Read more

jetpack compose - Draw circle on canvas

MainActivity.kt package com.cfsuman.jetpackcompose import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import androidx.activity.compose.setContent import androidx.compose.foundation.Canvas import androidx.compose.foundation.background import androidx.compose.foundation.layout.* import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.geometry.Offset import androidx.compose.ui.graphics.Color import androidx.compose.ui.tooling.preview.Preview class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { MainContent() } } @Composable fun MainContent(){ Canvas( modifier = Modifier .fillMaxSize() .background(Color(0xFFFAD6A5)) ) { val canvasWidth = size.width val canvasHeight = size.heig...
Read more

jetpack compose - Draw line on Canvas

MainActivity.kt package com.cfsuman.jetpackcompose import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import androidx.activity.compose.setContent import androidx.compose.foundation.Canvas import androidx.compose.foundation.background import androidx.compose.foundation.layout.* import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.geometry.Offset import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.StrokeCap import androidx.compose.ui.tooling.preview.Preview class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { MainContent() } } @Composable fun MainContent(){ Canvas( modifier = Modifier .fillMaxSize() .background(Color(0xFFACE5EE)) ) { val canvasWidth = size....
Read more