package
com.example.newcanaryproject
import
android.app.Activity
import
android.content.Context
import
android.content.Intent
import
android.graphics.Typeface
import
android.os.Bundle
import
android.speech.RecognizerIntent
import
android.speech.SpeechRecognizer
import
android.view.ViewGroup
import
android.widget.LinearLayout
import
android.widget.Toast
import
androidx.activity.ComponentActivity
import
androidx.activity.compose.setContent
import
androidx.annotation.Dimension.DP
import
androidx.compose.animation.Crossfade
import
androidx.compose.animation.core.animateFloatAsState
import
androidx.compose.animation.core.tween
import
androidx.compose.foundation.Image
import
androidx.compose.foundation.layout.*
import
androidx.compose.material.*
import
androidx.compose.material.icons.Icons
import
androidx.compose.material.icons.filled.Mic
import
androidx.compose.runtime.*
import
androidx.compose.ui.Alignment
import
androidx.compose.ui.Modifier
import
androidx.compose.ui.graphics.Color
import
androidx.compose.ui.graphics.toArgb
import
androidx.compose.ui.layout.layoutId
import
androidx.compose.ui.platform.LocalContext
import
androidx.compose.ui.res.dimensionResource
import
androidx.compose.ui.res.painterResource
import
androidx.compose.ui.text.TextStyle
import
androidx.compose.ui.text.font.FontFamily
import
androidx.compose.ui.text.font.FontStyle
import
androidx.compose.ui.text.style.TextAlign
import
androidx.compose.ui.unit.*
import
androidx.compose.ui.viewinterop.AndroidView
import
androidx.constraintlayout.compose.ConstraintSet
import
androidx.constraintlayout.compose.MotionLayout
import
com.example.newcanaryproject.ui.theme.*
import
com.github.mikephil.charting.charts.PieChart
import
com.github.mikephil.charting.components.Description
import
com.github.mikephil.charting.components.Legend
import
com.github.mikephil.charting.data.PieData
import
com.github.mikephil.charting.data.PieDataSet
import
com.github.mikephil.charting.data.PieEntry
import
org.intellij.lang.annotations.JdkConstants.HorizontalAlignment
import
java.util.*
class
MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super
.onCreate(savedInstanceState)
setContent {
NewCanaryProjectTheme {
Surface(
modifier = Modifier.fillMaxSize(),
color = MaterialTheme.colors.background
) {
Scaffold(
topBar = {
TopAppBar(backgroundColor = greenColor,
title = {
Text(
text =
"MotionLayout Button"
,
modifier = Modifier.fillMaxWidth(),
textAlign = TextAlign.Center,
color = Color.White
)
}
)
}
) {
Box(
modifier = Modifier
.fillMaxSize(),
contentAlignment = Alignment.Center,
) {
MotionLayoutButton()
}
}
}
}
}
}
}
@OptIn
(ExperimentalUnitApi::
class
)
@Composable
fun MotionLayoutButton() {
var animateButton by remember { mutableStateOf(
false
) }
val buttonAnimationProgress by animateFloatAsState(
targetValue =
if
(animateButton) 1f
else
0f,
animationSpec = tween(
1000
)
)
MotionLayout(
ConstraintSet(
""
" {
button1: {
width:
"spread"
,
height:
120
,
start: [
'parent'
,
'start'
,
16
],
end: [
'parent'
,
'end'
,
16
],
top: [
'parent'
,
'top'
,
0
]
},
button2: {
width:
"spread"
,
height:
120
,
start: [
'parent'
,
'start'
,
16
],
end: [
'parent'
,
'end'
,
16
],
top: [
'button1'
,
'bottom'
,
16
]
}
}
""
"
),
ConstraintSet(
""
" {
button1: {
width:
150
,
height:
120
,
start: [
'parent'
,
'start'
,
30
],
end: [
'button2'
,
'start'
,
10
]
},
button2: {
width:
150
,
height:
120
,
start: [
'button1'
,
'end'
,
10
],
end: [
'parent'
,
'end'
,
30
]
}
}
""
"
),
progress = buttonAnimationProgress,
modifier = Modifier
.fillMaxWidth()
.wrapContentHeight()
) {
Button(
onClick = {
animateButton = !animateButton
},
modifier = Modifier.layoutId(
"button1"
)
) {
Column(
modifier = Modifier
.padding(
3
.dp)
.fillMaxWidth()
.fillMaxHeight(),
verticalArrangement = Arrangement.Center,
horizontalAlignment = Alignment.CenterHorizontally
) {
Image(
painter = painterResource(id = R.drawable.python),
contentDescription =
"Python"
,
modifier = Modifier
.height(
60
.dp)
.width(
60
.dp)
)
Spacer(modifier = Modifier.height(
5
.dp))
Text(
text =
"Python"
,
color = Color.White,
fontSize = TextUnit(value = 18F, type = TextUnitType.Sp)
)
}
}
Button(
onClick = {
animateButton = !animateButton
},
modifier = Modifier.layoutId(
"button2"
)
) {
Column(
modifier = Modifier
.padding(
3
.dp)
.fillMaxWidth()
.fillMaxHeight(),
verticalArrangement = Arrangement.Center,
horizontalAlignment = Alignment.CenterHorizontally
) {
Image(
painter = painterResource(id = R.drawable.js),
contentDescription =
"Javascript"
,
modifier = Modifier
.height(
60
.dp)
.width(
60
.dp)
)
Spacer(modifier = Modifier.height(
5
.dp))
Text(
text =
"JavaScript"
,
color = Color.White,
fontSize = TextUnit(value = 18F, type = TextUnitType.Sp)
)
}
}
}
}