荭色海湾

JetpackCompose 之状态学习

1.无状态组件

1.1导入依赖

    implementation("androidx.core:core-ktx:1.9.0")
    implementation("androidx.lifecycle:lifecycle-runtime-ktx:2.6.1")
    implementation("androidx.activity:activity-compose:1.7.0")
    implementation(platform("androidx.compose:compose-bom:2023.03.00"))
    implementation("androidx.compose.ui:ui")
    implementation("androidx.compose.ui:ui-graphics")
    implementation("androidx.compose.ui:ui-tooling-preview")
    implementation("androidx.compose.material3:material3")

    implementation("com.google.android.material:material:1.11.0")
    implementation("androidx.compose.material:material-icons-extended:1.5.4")
    implementation("androidx.compose.runtime:runtime-livedata:1.5.4")
    implementation("androidx.compose.runtime:runtime:1.5.4")



    testImplementation("junit:junit:4.13.2")
    androidTestImplementation("androidx.test.ext:junit:1.1.5")
    androidTestImplementation("androidx.test.espresso:espresso-core:3.5.1")
    androidTestImplementation(platform("androidx.compose:compose-bom:2023.03.00"))
    androidTestImplementation("androidx.compose.ui:ui-test-junit4")
    debugImplementation("androidx.compose.ui:ui-tooling")
    debugImplementation("androidx.compose.ui:ui-test-manifest")

strings.xml


    JetpackComposeState
    Expand
    Collapse
    Crop
    Done
    Event
    Privacy
    Restored

themes.xml

1.2 数据类

package com.tiger.jetpackcomposestate.todo

import androidx.annotation.StringRes
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.CropSquare
import androidx.compose.material.icons.filled.Done
import androidx.compose.material.icons.filled.Event
import androidx.compose.material.icons.filled.PrivacyTip
import androidx.compose.material.icons.filled.RestoreFromTrash
import androidx.compose.material.icons.filled.Square
import androidx.compose.ui.graphics.vector.ImageVector
import com.tiger.jetpackcomposestate.R
import java.util.UUID

data class TodoItem(val task:String,val icon:TodoIcon = TodoIcon.Default,val id:UUID=UUID.randomUUID())


enum class TodoIcon(
    val imageVector: ImageVector,
    @StringRes val contentDescription: Int
){
    //使用了 Material Design 的图标
    Square(Icons.Default.CropSquare, R.string.cd_expand),
    Done(Icons.Default.Done, R.string.cd_done),
    Event(Icons.Default.Event, R.string.cd_event),
    Privacy(Icons.Default.PrivacyTip, R.string.cd_privacy),
    Trash(Icons.Default.RestoreFromTrash, R.string.cd_restore);

    companion object {
        val Default = Square
    }


}

package com.tiger.jetpackcomposestate.todo.one

import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material3.Button
import androidx.compose.material3.Icon
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp
import com.tiger.jetpackcomposestate.todo.TodoItem

@Composable
fun TodoScreen(
    items:List
){

    Column() {
        LazyColumn(
            modifier = Modifier.weight(1f),//优先修饰 列表的布局
            contentPadding = PaddingValues(top = 8.dp)

        ){
            items(items){
                TodoRow(todo = it, modifier = Modifier.fillParentMaxWidth())
            }
        }
        Button(onClick = {

        },
            modifier = Modifier
                .padding(16.dp)
                .fillMaxWidth()

        ) {
        Text(text = "Add random item" )

        }
    }

}


@Composable
fun TodoRow(
    todo: TodoItem,
    modifier: Modifier = Modifier
){

    Row(
        modifier = modifier
            .padding(horizontal = 16.dp, vertical = 8.dp),
        horizontalArrangement = Arrangement.SpaceBetween  //子元素水平均匀分布
    ) {
        Text(text = todo.task)
        Icon(imageVector = todo.icon.imageVector
            ,contentDescription = stringResource(id = todo.icon.contentDescription))//stringResource去到strings.xml文件里去找到对应的字符串 描述
    }



}

package com.tiger.jetpackcomposestate.todo.one

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.runtime.Composable
import com.tiger.jetpackcomposestate.todo.TodoIcon
import com.tiger.jetpackcomposestate.todo.TodoItem
import com.tiger.jetpackcomposestate.ui.theme.JetpackComposeStateTheme

class TodoActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            JetpackComposeStateTheme {

                TodoActivityScreen()
            }
        }
    }

    @Composable
    private fun TodoActivityScreen() {
        val items = listOf(
            TodoItem(task = "Learn compose", icon = TodoIcon.Event),
            TodoItem(task = "Take the codelab"),
            TodoItem(task = "Apply state", icon = TodoIcon.Done),
            TodoItem(task = "Build dynamic UIs", icon = TodoIcon.Square),
        )

        TodoScreen(items)
    }
}

TodoViewModel.kt

package com.jmj.jetpackcomposestate.todo.one

import androidx.lifecycle.LiveData
import androidx.lifecycle.MutableLiveData
import androidx.lifecycle.ViewModel
import com.jmj.jetpackcomposestate.todo.TodoItem

class TodoViewModel:ViewModel(){

    private var _todoItems = MutableLiveData(listOf())  //这是一个状态

    val  todoItems:LiveData> = _todoItems

    fun addItem(item:TodoItem){
        //添加
        _todoItems.value = _todoItems.value!! + listOf(item)
    }


    fun removeItem(item:TodoItem){
        //删除
        _todoItems.value =_todoItems.value!!.toMutableList().also {
            it.remove(item)
        }

    }
}

TodoScreen.kt

package com.jmj.jetpackcomposestate.todo.one

import androidx.compose.foundation.clickable
import com.jmj.jetpackcomposestate.todo.TodoItem


import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material3.Button
import androidx.compose.material3.Icon
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp
import com.jmj.jetpackcomposestate.util.generateRandomTodoItem


@Composable
fun TodoScreen(
    items:List,
    onAddItem: (TodoItem) ->Unit,
    onRemoveItem: (TodoItem) ->Unit
){

    Column() {
        LazyColumn(
            modifier = Modifier.weight(1f),//优先修饰 列表的布局
            contentPadding = PaddingValues(top = 8.dp)

        ){
            items(items){
                TodoRow(todo = it, modifier = Modifier.fillParentMaxWidth(), onItemClicked = {onRemoveItem(it)})
            }
        }
        Button(onClick = {
                onAddItem(generateRandomTodoItem())
        },
            modifier = Modifier
                .padding(16.dp)
                .fillMaxWidth()

        ) {
            Text(text = "Add random item" )

        }
    }

}


@Composable
fun TodoRow(
    todo: TodoItem,
    onItemClicked:(TodoItem) -> Unit,
    modifier: Modifier = Modifier,

){

    Row(
        modifier = modifier
            .clickable{
                onItemClicked(todo)
            }
            .padding(horizontal = 16.dp, vertical = 8.dp),
        horizontalArrangement = Arrangement.SpaceBetween  //子元素水平均匀分布
    ) {
        Text(text = todo.task)
        Icon(imageVector = todo.icon.imageVector
            ,contentDescription = stringResource(id = todo.icon.contentDescription))//stringResource去到strings.xml文件里去找到对应的字符串 描述
    }



}

TodoAcitivity.kt

package com.jmj.jetpackcomposestate.todo.one

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.activity.viewModels
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.livedata.observeAsState
import com.jmj.jetpackcomposestate.todo.TodoIcon
import com.jmj.jetpackcomposestate.todo.TodoItem
import com.jmj.jetpackcomposestate.ui.theme.JetpackComposeStateTheme


class TodoActivity : ComponentActivity() {

    private val todoViewModel by viewModels()

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            JetpackComposeStateTheme {

                TodoActivityScreen()
            }
        }
    }

    @Composable
    private fun TodoActivityScreen() {
//        val items = listOf(
//            TodoItem(task = "Learn compose", icon = TodoIcon.Event),
//            TodoItem(task = "Take the codelab"),
//            TodoItem(task = "Apply state", icon = TodoIcon.Done),
//            TodoItem(task = "Build dynamic UIs", icon = TodoIcon.Square),
//        )
//
//        TodoScreen(items)
        val items:List by todoViewModel.todoItems.observeAsState(initial = listOf())



        TodoScreen(
            items=items,
            onAddItem = {  todoViewModel.addItem(it) },
            onRemoveItem = {todoViewModel.removeItem(it)}
            )

    }
}

2.重组

package com.jmj.jetpackcomposestate.todo.one


import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.Button
import androidx.compose.material3.Icon
import androidx.compose.material3.LocalContentColor
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp
import com.tiger.jetpackcomposestate.todo.TodoItem
import com.tiger.jetpackcomposestate.util.generateRandomTodoItem
import kotlin.random.Random


@Composable
fun TodoScreen(
    items: List,
    onAddItem: (TodoItem) -> Unit,
    onRemoveItem: (TodoItem) -> Unit
) {


    Column() {
        LazyColumn(
            modifier = Modifier
                .weight(1f),//优先修饰 列表的布局 表示剩下多少空间就站多少空间
            contentPadding = PaddingValues(top = 8.dp)

        ) {


            items(items) {
                TodoRow(
                    todo = it,
                    modifier = Modifier.fillParentMaxWidth(),
                    onItemClicked = onRemoveItem
                )
            }

//            item {
//                Button(
//                    onClick = {
//                        onAddItem(generateRandomTodoItem())
//                    },
//                    modifier = Modifier
//                        .padding(16.dp)
//                        .fillMaxWidth()
//
//                ) {
//                    Text(text = "Add random item")
//
//                }
//            }
        }
        Button(
            onClick = {
                onAddItem(generateRandomTodoItem())
            },
            modifier = Modifier
                .padding(16.dp)
                .fillMaxWidth(),
            shape = RoundedCornerShape(0.dp)

        ) {
            Text(text = "Add random item")

        }

    }
}


@Composable
fun TodoRow(
    todo: TodoItem,
    onItemClicked: (TodoItem) -> Unit,
    modifier: Modifier = Modifier,

    ) {


    Row(
        modifier = modifier
            .clickable {
                onItemClicked(todo)
            }
            .padding(horizontal = 16.dp, vertical = 8.dp),
        horizontalArrangement = Arrangement.SpaceBetween  //子元素水平均匀分布
    ) {
        Text(text = todo.task)
        val iconAlpha: Float = remember(todo.id) {
            randomTint()
        }
        Icon(
            imageVector = todo.icon.imageVector,
            tint = LocalContentColor.current.copy(alpha = iconAlpha) //用来隐式传参
            , contentDescription = stringResource(id = todo.icon.contentDescription)
        )//stringResource去到strings.xml文件里去找到对应的字符串 描述
    }
}


private fun randomTint(): Float {
    return Random.nextFloat().coerceIn(0.3f, 0.9f)
}

3.MutableState

package com.jmj.jetpackcomposestate.todo.one


import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Text
import androidx.compose.material3.TextButton
import androidx.compose.material3.TextField
import androidx.compose.material3.TextFieldDefaults
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import com.jmj.jetpackcomposestate.todo.TodoItem


//输入框
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun TodoInputText(
    text: String,
    onTextChange: (String) -> Unit,
    modifier: Modifier = Modifier
) {
    //输入框
    TextField(
        value = text,
        onValueChange = onTextChange,
        colors = TextFieldDefaults.textFieldColors(containerColor = Color.Transparent),
        maxLines = 1,
        modifier = modifier
    )


}

//按钮
@Composable
fun TodoEditText(
    onClick: () -> Unit,
    text: String,
    modifier: Modifier = Modifier,
    enabled: Boolean = true
) {
    TextButton(
        onClick = onClick,
        shape = CircleShape,
        colors = ButtonDefaults.buttonColors(),
        modifier = modifier,
        enabled = enabled
    ) {

        Text(text = text)

    }

}


@Composable
fun TodoItemInput(
    onItemComplete: (TodoItem) -> Unit
) {

//    val (text, setText) = rememberSaveable { mutableStateOf("") } //屏幕旋转之后会保存值


    /**
     * 这个函数使用remember 给自己添加内存 ，然后在内存 中存储 一个由  mutableStateOf 创建的 MutableState
     *  它是Compose 的内置类型 ，提供了一个可观察的状态持有者
     *  val (text, setText) = remember{ mutableStateOf(default) }
     *  对 value 的任何更改都将 自动重新 组合读取此状态的任何可组合函数
     */
    val (text, setText) = remember{ mutableStateOf("") } //屏幕旋转之后不会会保存值

    Column {

        Row(
            Modifier
                .padding(horizontal = 16.dp)
                .padding(top = 16.dp)
        ) {
            //输入框
            TodoInputText(
                text = text,
                onTextChange = setText,//setText相当于onTextChange{ text=it }他这里用了语法糖
                modifier = Modifier
                    .weight(1f)
                    .padding(end = 8.dp)
            )

            //按钮
            TodoEditText(onClick = {

                onItemComplete(TodoItem(text))
                setText("")

            },
                text = "Add",
                modifier = Modifier.align(Alignment.CenterVertically),
                enabled = text.isNotBlank()

            )


        }


    }


}

做出下面的选择按钮

package com.jmj.jetpackcomposestate.todo.one


import androidx.compose.animation.AnimatedVisibility
import androidx.compose.animation.core.FastOutLinearInEasing
import androidx.compose.animation.core.FastOutSlowInEasing
import androidx.compose.animation.core.TweenSpec
import androidx.compose.animation.fadeIn
import androidx.compose.animation.fadeOut
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.defaultMinSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.lazy.LazyRow
import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButtonColors
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.material3.TextButton
import androidx.compose.material3.TextField
import androidx.compose.material3.TextFieldDefaults
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp
import com.jmj.jetpackcomposestate.todo.TodoIcon
import com.jmj.jetpackcomposestate.todo.TodoItem


//输入框
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun TodoInputText(
    text: String,
    onTextChange: (String) -> Unit,
    modifier: Modifier = Modifier
) {
    //输入框
    TextField(
        value = text,
        onValueChange = onTextChange,
        colors = TextFieldDefaults.textFieldColors(containerColor = Color.Transparent),
        maxLines = 1,
        modifier = modifier
    )


}

//按钮
@Composable
fun TodoEditText(
    onClick: () -> Unit,
    text: String,
    modifier: Modifier = Modifier,
    enabled: Boolean = true
) {
    TextButton(
        onClick = onClick,
        shape = CircleShape,
        colors = ButtonDefaults.buttonColors(),
        modifier = modifier,
        enabled = enabled
    ) {

        Text(text = text)

    }

}


//一排图标 ，根据文本框是否有内容，自动收起和弹出，带动画效果
@Composable
fun AnimatedIconRow(
    icon: TodoIcon,
    onIconChange: (TodoIcon) -> Unit,
    modifier: Modifier = Modifier,
    visible: Boolean = true //可见性 状态  根据我们输入是否有内容来判度是否显示
) {

    val enter = remember {
        fadeIn(animationSpec = TweenSpec(300, easing = FastOutLinearInEasing)) //300ms打开 ，预定效果器
    }//淡入动画

    val exit = remember {
        fadeOut(animationSpec = TweenSpec(100, easing = FastOutSlowInEasing))
    }//淡出动画

    Box(modifier = modifier.defaultMinSize(minHeight = 16.dp)) {//默认最小高度16dp
        AnimatedVisibility(
            visible = visible,
            enter = enter,//进入
            exit = exit //退出
        ) {//动画效果
            IconRow(icon = icon, onIconChange = onIconChange)

        }
    }

}

@Composable
fun IconRow(
    icon: TodoIcon,
    onIconChange: (TodoIcon) -> Unit,
    modifier: Modifier = Modifier
) {

    LazyRow(modifier = modifier) {

        val itemsIcon = TodoIcon.values() + TodoIcon.values()
        items(items = itemsIcon) {
            SelectableIconButton(
                icon = it.imageVector,
                iconContentDescription = it.contentDescription,
                onIconSelected = { onIconChange(it) },
                isSelected = (it == icon)

            )
        }
//        for (todoIcon in TodoIcon.values()) {
//            SelectableIconButton(
//                icon = todoIcon.imageVector,
//                iconContentDescription = todoIcon.contentDescription,
//                onIconSelected = { onIconChange(todoIcon) },
//                isSelected = (todoIcon == icon)
//
//            )
//        }
    }

}

@Composable
fun SelectableIconButton(
    icon: ImageVector,
    iconContentDescription: Int,
    onIconSelected: () -> Unit,
    isSelected: Boolean,
    modifier: Modifier = Modifier
) {
    //图标选中和未选中状态，颜色是不一样的
    val tint = if (isSelected) {
        //选择之后的颜色
        MaterialTheme.colorScheme.primary   //蓝色
    } else {
        MaterialTheme.colorScheme.onSurface.copy(alpha = 0.6f) //黑色
    }

    TextButton(
        onClick = { onIconSelected() },
        shape = CircleShape,
        modifier = modifier
    ) {

        Column {
            Icon(
                imageVector = icon,
                tint = tint,
                contentDescription = stringResource(id = iconContentDescription)
            )

            if (isSelected) {
                //如果被选中了  下划线
                Box(
                    modifier = Modifier
                        .padding(top = 3.dp)
                        .width(icon.defaultWidth)
                        .height(1.dp)
                        .background(tint)

                )
            } else {
                Spacer(modifier = Modifier.height(4.dp))
            }


        }


    }

}


@Composable
fun TodoItemInput(
    onItemComplete: (TodoItem) -> Unit
) {

//    val (text, setText) = rememberSaveable { mutableStateOf("") } //屏幕旋转之后会保存值


    /**
     * 这个函数使用remember 给自己添加内存 ，然后在内存 中存储 一个由  mutableStateOf 创建的 MutableState
     *  它是Compose 的内置类型 ，提供了一个可观察的状态持有者
     *  val (text, setText) = remember{ mutableStateOf(default) }
     *  对 value 的任何更改都将 自动重新 组合读取此状态的任何可组合函数
     */
    val (text, setText) = remember { mutableStateOf("") } //屏幕旋转之后不会会保存值
    val (icon, setIcon) = remember { mutableStateOf(TodoIcon.Default) }

    val iconsVisible = text.isNotBlank()


    if (text.isBlank()) {
        setIcon(TodoIcon.Default)
    }

    Column {

        Row(
            Modifier
                .padding(horizontal = 16.dp)
                .padding(top = 16.dp)
        ) {
            //输入框
            TodoInputText(
                text = text,
                onTextChange = setText,//setText相当于onTextChange{ text=it }他这里用了语法糖
                modifier = Modifier
                    .weight(1f)
                    .padding(end = 8.dp)
            )

            //按钮
            TodoEditText(
                onClick = {

                    onItemComplete(TodoItem(text, icon))
                    setText("")

                },
                text = "Add",
                modifier = Modifier.align(Alignment.CenterVertically),
                enabled = text.isNotBlank()

            )


        }


            AnimatedIconRow(icon = icon, {
                setIcon(it)
            }, Modifier.padding(top = 10.dp),iconsVisible)

        
        Text(text = "测试")


    }


}

4. 软键盘

package com.jmj.jetpackcomposestate.todo.two


import androidx.compose.animation.AnimatedVisibility
import androidx.compose.animation.core.FastOutLinearInEasing
import androidx.compose.animation.core.FastOutSlowInEasing
import androidx.compose.animation.core.TweenSpec
import androidx.compose.animation.fadeIn
import androidx.compose.animation.fadeOut
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.defaultMinSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.lazy.LazyRow
import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.text.KeyboardActions
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButtonColors
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.material3.TextButton
import androidx.compose.material3.TextField
import androidx.compose.material3.TextFieldDefaults
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.ui.Alignment
import androidx.compose.ui.ExperimentalComposeUiApi
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.platform.LocalSoftwareKeyboardController
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.input.ImeAction
import androidx.compose.ui.unit.dp
import com.jmj.jetpackcomposestate.todo.TodoIcon
import com.jmj.jetpackcomposestate.todo.TodoItem


//输入框
@OptIn(ExperimentalMaterial3Api::class, ExperimentalComposeUiApi::class)
@Composable
fun TodoInputText(
    text: String,
    onTextChange: (String) -> Unit,
    modifier: Modifier = Modifier,
    onImeAction: () -> Unit ={ }
) {

    val keyboardController = LocalSoftwareKeyboardController.current

    //输入框
    TextField(
        value = text,
        onValueChange = onTextChange,
        colors = TextFieldDefaults.textFieldColors(containerColor = Color.Transparent),
        maxLines = 1,
        modifier = modifier,
        //配置软件盘
        keyboardOptions = KeyboardOptions.Default.copy(imeAction = ImeAction.Done),
        keyboardActions = KeyboardActions(onDone = {
            //点击完成之后的回调函数
            onImeAction()
            //隐藏软键盘
            keyboardController?.hide()

        })
    )


}

//按钮
@Composable
fun TodoEditText(
    onClick: () -> Unit,
    text: String,
    modifier: Modifier = Modifier,
    enabled: Boolean = true
) {
    TextButton(
        onClick = onClick,
        shape = CircleShape,
        colors = ButtonDefaults.buttonColors(),
        modifier = modifier,
        enabled = enabled
    ) {

        Text(text = text)

    }

}


//一排图标 ，根据文本框是否有内容，自动收起和弹出，带动画效果
@Composable
fun AnimatedIconRow(
    icon: TodoIcon,
    onIconChange: (TodoIcon) -> Unit,
    modifier: Modifier = Modifier,
    visible: Boolean = true //可见性 状态  根据我们输入是否有内容来判度是否显示
) {

    val enter = remember {
        fadeIn(animationSpec = TweenSpec(300, easing = FastOutLinearInEasing)) //300ms打开 ，预定效果器
    }//淡入动画

    val exit = remember {
        fadeOut(animationSpec = TweenSpec(100, easing = FastOutSlowInEasing))
    }//淡出动画

    Box(modifier = modifier.defaultMinSize(minHeight = 16.dp)) {//默认最小高度16dp
        AnimatedVisibility(
            visible = visible,
            enter = enter,//进入
            exit = exit //退出
        ) {//动画效果
            IconRow(icon = icon, onIconChange = onIconChange)

        }
    }

}

@Composable
fun IconRow(
    icon: TodoIcon,
    onIconChange: (TodoIcon) -> Unit,
    modifier: Modifier = Modifier
) {

    LazyRow(modifier = modifier) {

        val itemsIcon = TodoIcon.values() + TodoIcon.values()
        items(items = itemsIcon) {
            SelectableIconButton(
                icon = it.imageVector,
                iconContentDescription = it.contentDescription,
                onIconSelected = { onIconChange(it) },
                isSelected = (it == icon)

            )
        }
//        for (todoIcon in TodoIcon.values()) {
//            SelectableIconButton(
//                icon = todoIcon.imageVector,
//                iconContentDescription = todoIcon.contentDescription,
//                onIconSelected = { onIconChange(todoIcon) },
//                isSelected = (todoIcon == icon)
//
//            )
//        }
    }

}

@Composable
fun SelectableIconButton(
    icon: ImageVector,
    iconContentDescription: Int,
    onIconSelected: () -> Unit,
    isSelected: Boolean,
    modifier: Modifier = Modifier
) {
    //图标选中和未选中状态，颜色是不一样的
    val tint = if (isSelected) {
        //选择之后的颜色
        MaterialTheme.colorScheme.primary   //蓝色
    } else {
        MaterialTheme.colorScheme.onSurface.copy(alpha = 0.6f) //黑色
    }

    TextButton(
        onClick = { onIconSelected() },
        shape = CircleShape,
        modifier = modifier
    ) {

        Column {
            Icon(
                imageVector = icon,
                tint = tint,
                contentDescription = stringResource(id = iconContentDescription)
            )

            if (isSelected) {
                //如果被选中了  下划线
                Box(
                    modifier = Modifier
                        .padding(top = 3.dp)
                        .width(icon.defaultWidth)
                        .height(1.dp)
                        .background(tint)

                )
            } else {
                Spacer(modifier = Modifier.height(4.dp))
            }


        }


    }

}


@Composable
fun TodoItemInput(
    onItemComplete: (TodoItem) -> Unit
) {

//    val (text, setText) = rememberSaveable { mutableStateOf("") } //屏幕旋转之后会保存值


    /**
     * 这个函数使用remember 给自己添加内存 ，然后在内存 中存储 一个由  mutableStateOf 创建的 MutableState
     *  它是Compose 的内置类型 ，提供了一个可观察的状态持有者
     *  val (text, setText) = remember{ mutableStateOf(default) }
     *  对 value 的任何更改都将 自动重新 组合读取此状态的任何可组合函数
     */
    val (text, setText) = remember { mutableStateOf("") } //屏幕旋转之后不会会保存值
    val (icon, setIcon) = remember { mutableStateOf(TodoIcon.Default) }

    val iconsVisible = text.isNotBlank()

    //点击 "add" 按钮，提交要做的事情
    val submit = {
        onItemComplete(TodoItem(text, icon))
        setText("")
    }


    if (text.isBlank()) {
        setIcon(TodoIcon.Default)
    }

    Column {

        Row(
            Modifier
                .padding(horizontal = 16.dp)
                .padding(top = 16.dp)
        ) {
            //输入框
            TodoInputText(
                text = text,
                onTextChange = setText,//setText相当于onTextChange{ text=it }他这里用了语法糖
                modifier = Modifier
                    .weight(1f)
                    .padding(end = 8.dp),
                onImeAction = submit
            )

            //按钮
            TodoEditText(
                onClick = {

                    submit()

                },
                text = "Add",
                modifier = Modifier.align(Alignment.CenterVertically),
                enabled = text.isNotBlank()

            )


        }


            AnimatedIconRow(icon = icon, {
                setIcon(it)
            }, Modifier.padding(top = 10.dp),iconsVisible)

        
        Text(text = "测试")


    }


}

5.输入框背景

package com.jmj.jetpackcomposestate.todo.three


import androidx.compose.animation.AnimatedVisibility
import androidx.compose.animation.animateColorAsState
import androidx.compose.animation.animateContentSize
import androidx.compose.animation.core.FastOutLinearInEasing
import androidx.compose.animation.core.FastOutSlowInEasing
import androidx.compose.animation.core.TweenSpec
import androidx.compose.animation.core.animateDpAsState
import androidx.compose.animation.fadeIn
import androidx.compose.animation.fadeOut
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.RowScope
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.defaultMinSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.lazy.LazyRow
import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.text.KeyboardActions
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButtonColors
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.material3.TextButton
import androidx.compose.material3.TextField
import androidx.compose.material3.TextFieldDefaults
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.ui.Alignment
import androidx.compose.ui.ExperimentalComposeUiApi
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.RectangleShape
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.platform.LocalSoftwareKeyboardController
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.input.ImeAction
import androidx.compose.ui.unit.dp
import com.jmj.jetpackcomposestate.todo.TodoIcon
import com.jmj.jetpackcomposestate.todo.TodoItem


// 顶部输入框 加上一个 灰色背景
@Composable
fun TodoItemInputBackground(
    elevate: Boolean,//如果为True  就有一个阴影边框
    modifier: Modifier = Modifier,
    content: @Composable RowScope.() -> Unit
) {
    //帧动画的形式展现Surface底部的阴影

    val animatedElevation by animateDpAsState(if (elevate) 1.dp else 0.dp ,TweenSpec(500))


    Surface(
        color = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.05f),//设置 背景容器颜色，为黑色，透明度为0.05f
        //Surface 面版 底部有一个小小的阴影
        shadowElevation = animatedElevation, //一个委托 当发生改变的时候重构建组件
        shape = RectangleShape //设置阴影 展示动画 1dp 长方形
    ) {
        Row(
            modifier = modifier.animateContentSize(animationSpec = TweenSpec(300)),
            content = content
        )

    }
}


//输入框
@OptIn(ExperimentalMaterial3Api::class, ExperimentalComposeUiApi::class)
@Composable
fun TodoInputText(
    text: String,
    onTextChange: (String) -> Unit,
    modifier: Modifier = Modifier,
    onImeAction: () -> Unit = { }
) {

    val keyboardController = LocalSoftwareKeyboardController.current

    //输入框
    TextField(
        value = text,
        onValueChange = onTextChange,
        colors = TextFieldDefaults.textFieldColors(containerColor = Color.Transparent),
        maxLines = 1,
        modifier = modifier,
        //配置软件盘
        keyboardOptions = KeyboardOptions.Default.copy(imeAction = ImeAction.Done),
        keyboardActions = KeyboardActions(onDone = {
            //点击完成之后的回调函数
            onImeAction()
            //隐藏软键盘
            keyboardController?.hide()

        })
    )


}

//按钮
@Composable
fun TodoEditText(
    onClick: () -> Unit,
    text: String,
    modifier: Modifier = Modifier,
    enabled: Boolean = true
) {
    TextButton(
        onClick = onClick,
        shape = CircleShape,
        colors = ButtonDefaults.buttonColors(),
        modifier = modifier,
        enabled = enabled
    ) {

        Text(text = text)

    }

}


//一排图标 ，根据文本框是否有内容，自动收起和弹出，带动画效果
@Composable
fun AnimatedIconRow(
    icon: TodoIcon,
    onIconChange: (TodoIcon) -> Unit,
    modifier: Modifier = Modifier,
    visible: Boolean = true //可见性 状态  根据我们输入是否有内容来判度是否显示
) {

    val enter = remember {
        fadeIn(animationSpec = TweenSpec(300, easing = FastOutLinearInEasing)) //300ms打开 ，预定效果器
    }//淡入动画

    val exit = remember {
        fadeOut(animationSpec = TweenSpec(100, easing = FastOutSlowInEasing))
    }//淡出动画

    Box(modifier = modifier.defaultMinSize(minHeight = 16.dp)) {//默认最小高度16dp
        AnimatedVisibility(
            visible = visible,
            enter = enter,//进入
            exit = exit //退出
        ) {//动画效果
            IconRow(icon = icon, onIconChange = onIconChange)

        }
    }

}

@Composable
fun IconRow(
    icon: TodoIcon,
    onIconChange: (TodoIcon) -> Unit,
    modifier: Modifier = Modifier
) {

    LazyRow(modifier = modifier) {

        val itemsIcon = TodoIcon.values() + TodoIcon.values()
        items(items = itemsIcon) {
            SelectableIconButton(
                icon = it.imageVector,
                iconContentDescription = it.contentDescription,
                onIconSelected = { onIconChange(it) },
                isSelected = (it == icon)

            )
        }
//        for (todoIcon in TodoIcon.values()) {
//            SelectableIconButton(
//                icon = todoIcon.imageVector,
//                iconContentDescription = todoIcon.contentDescription,
//                onIconSelected = { onIconChange(todoIcon) },
//                isSelected = (todoIcon == icon)
//
//            )
//        }
    }

}

@Composable
fun SelectableIconButton(
    icon: ImageVector,
    iconContentDescription: Int,
    onIconSelected: () -> Unit,
    isSelected: Boolean,
    modifier: Modifier = Modifier
) {
    //图标选中和未选中状态，颜色是不一样的
    val tint = if (isSelected) {
        //选择之后的颜色
        MaterialTheme.colorScheme.primary   //蓝色
    } else {
        MaterialTheme.colorScheme.onSurface.copy(alpha = 0.6f) //黑色
    }

    TextButton(
        onClick = { onIconSelected() },
        shape = CircleShape,
        modifier = modifier
    ) {

        Column {
            Icon(
                imageVector = icon,
                tint = tint,
                contentDescription = stringResource(id = iconContentDescription)
            )

            if (isSelected) {
                //如果被选中了  下划线
                Box(
                    modifier = Modifier
                        .padding(top = 3.dp)
                        .width(icon.defaultWidth)
                        .height(1.dp)
                        .background(tint)

                )
            } else {
                Spacer(modifier = Modifier.height(4.dp))
            }


        }


    }

}


@Composable
fun TodoItemEntryInput(onItemComplete: (TodoItem) -> Unit){


    val (text, setText) = remember { mutableStateOf("") } //屏幕旋转之后不会会保存值
    val (icon, setIcon) = remember { mutableStateOf(TodoIcon.Default) }

    val iconsVisible = text.isNotBlank()

    //点击 "add" 按钮，提交要做的事情
    val submit = {
        onItemComplete(TodoItem(text, icon))
        setText("")
    }
    TodoItemInput(
        text = text,
        onTextChange = setText,
        icon = icon,
        onIconChange = setIcon,
        submit = submit,
        iconsVisible = iconsVisible
    ){
        TodoEditText(
            onClick = {

                submit()

            },
            text = "Add",
            modifier = Modifier.align(Alignment.CenterVertically),
            enabled = text.isNotBlank()

        )
    }

}

@Composable
fun TodoItemInput(text: String,
                  onTextChange: (String) -> Unit,
                  icon: TodoIcon, onIconChange: (TodoIcon) -> Unit,
                  submit: () -> Unit,
                  iconsVisible: Boolean,
                  buttonSlot : @Composable RowScope.() -> Unit
) {


    if (text.isBlank()) {
        onIconChange(TodoIcon.Default)
    }

    Column {

        Row(
            Modifier
                .padding(horizontal = 16.dp)
                .padding(top = 16.dp)
        ) {
            //输入框
            TodoInputText(
                text = text,
                onTextChange = onTextChange,//setText相当于onTextChange{ text=it }他这里用了语法糖
                modifier = Modifier
                    .weight(1f)
                    .padding(end = 8.dp),
                onImeAction = submit
            )

            //按钮
            buttonSlot()


        }


        AnimatedIconRow(icon = icon, {
            onIconChange(it)
        }, Modifier.padding(top = 10.dp), iconsVisible)


}



}

package com.jmj.jetpackcomposestate.todo.three

import androidx.compose.foundation.clickable
import com.jmj.jetpackcomposestate.todo.TodoItem


import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material3.Button
import androidx.compose.material3.Icon
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp
import com.jmj.jetpackcomposestate.util.generateRandomTodoItem


@Composable
fun TodoScreen(
    items:List,
    onAddItem: (TodoItem) ->Unit,
    onRemoveItem: (TodoItem) ->Unit
){

    Column() {
        //输入框 ，外加一个灰色背景
            TodoItemInputBackground(elevate = true) {
                TodoItemEntryInput(onItemComplete = onAddItem )
            }

        LazyColumn(
            modifier = Modifier.weight(1f),//优先修饰 列表的布局
            contentPadding = PaddingValues(top = 8.dp)

        ){
            items(items){
                TodoRow(todo = it, modifier = Modifier.fillParentMaxWidth(), onItemClicked = {onRemoveItem(it)})
            }
        }
        Button(onClick = {
                onAddItem(generateRandomTodoItem())
        },
            modifier = Modifier
                .padding(16.dp)
                .fillMaxWidth()

        ) {
            Text(text = "Add random item" )

        }
    }

}


@Composable
fun TodoRow(
    todo: TodoItem,
    onItemClicked:(TodoItem) -> Unit,
    modifier: Modifier = Modifier,

){

    Row(
        modifier = modifier
            .clickable {
                onItemClicked(todo)
            }
            .padding(horizontal = 16.dp, vertical = 8.dp),
        horizontalArrangement = Arrangement.SpaceBetween  //子元素水平均匀分布
    ) {
        Text(text = todo.task)
        Icon(imageVector = todo.icon.imageVector
            ,contentDescription = stringResource(id = todo.icon.contentDescription))//stringResource去到strings.xml文件里去找到对应的字符串 描述
    }



}

6.编辑模式

TodoScreen

package com.jmj.jetpackcomposestate.todo.four

import androidx.compose.foundation.clickable
import com.jmj.jetpackcomposestate.todo.TodoItem


import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material3.Button
import androidx.compose.material3.Icon
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.remember
import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.alpha
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import com.jmj.jetpackcomposestate.util.generateRandomTodoItem
import kotlin.random.Random


@Composable
fun TodoScreen(
    items: List,
    currentlyEditing: TodoItem?,
    onAddItem: (TodoItem) -> Unit,
    onRemoveItem: (TodoItem) -> Unit,
    onStartEdit: (TodoItem) -> Unit,
    onEditItemChange: (TodoItem) -> Unit,
    onEditDone: () -> Unit // 完成
) {

    Column() {


        // 当currentlyEditing(当前编辑条目)  为空是，显示添加输入框
        //否则进入编辑状态时，最顶部 会显示 "Editing item "文本
        val enableTopSection = (currentlyEditing == null)



        //输入框 ，外加一个灰色背景
        TodoItemInputBackground(elevate = true) {
           if (enableTopSection){
               TodoItemEntryInput(onItemComplete = onAddItem)
           }else{
               Text(
                   text = "Editing item",
                   style = MaterialTheme.typography.titleLarge,
                   textAlign = TextAlign.Center,//文字水平居中
                   modifier = Modifier
                       .align(Alignment.CenterVertically)//控件垂直居中
                       .padding(16.dp)
                       .fillMaxWidth()
                   )
           }
        }

        LazyColumn(
            modifier = Modifier.weight(1f),//优先修饰 列表的布局
            contentPadding = PaddingValues(top = 8.dp) //内容边距

        ) {
            items(items) { todo ->
                if (currentlyEditing?.id == todo.id) {
                    TodoItemInlineEditor(
                        item = todo,
                        onEditItemChange = onEditItemChange,
                        onEditDone = onEditDone,
                        onRemoveItem = onRemoveItem
                    )
                } else {
                    TodoRow(
                        todo = todo,
                        modifier = Modifier.fillParentMaxWidth(),
                        onItemClicked = { onStartEdit(todo) })

                }
            }
        }
        Button(
            onClick = {
                onAddItem(generateRandomTodoItem())
            },
            modifier = Modifier
                .padding(16.dp)
                .fillMaxWidth()

        ) {
            Text(text = "Add random item")

        }
    }

}


@Composable
fun TodoRow(
    todo: TodoItem,
    onItemClicked: (TodoItem) -> Unit,
    modifier: Modifier = Modifier,

    ) {

    val alpha = rememberSaveable{
        Random.nextFloat().coerceIn(0.3f,0.9f)
    }

    Row(
        modifier = modifier
            .clickable {
                onItemClicked(todo)
            }
            .padding(horizontal = 16.dp, vertical = 8.dp),
        horizontalArrangement = Arrangement.SpaceBetween  //子元素水平均匀分布
    ) {
        Text(text = todo.task)
        Icon(
            imageVector = todo.icon.imageVector,
            contentDescription = stringResource(id = todo.icon.contentDescription),
            modifier=Modifier.alpha(alpha)
        )//stringResource去到strings.xml文件里去找到对应的字符串 描述
    }


}

TodoViewModle

package com.jmj.jetpackcomposestate.todo.four

import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateListOf
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.setValue
import androidx.lifecycle.LiveData
import androidx.lifecycle.MutableLiveData
import androidx.lifecycle.ViewModel
import com.jmj.jetpackcomposestate.todo.TodoItem

/**
 * 状态容器
 */
class TodoViewModel : ViewModel() {


    //TodoItems集合只读
    var todoItems = mutableStateListOf()
        private set


    //当前正在编辑的TodoItem 的索引位置
    private var currentEditPostion by mutableStateOf(-1)

    //当前正在编辑的TodoItem 的对象
    val currentEditItem: TodoItem? get() = todoItems.getOrNull(currentEditPostion)


    fun addItem(item: TodoItem) {
        //添加
        todoItems.add(item)//因为是封装了状态对象，所以改变值会自动重构组件,调用此状态的组件

    }


    fun removeItem(item: TodoItem) {
        //删除
        todoItems.remove(item)
        onEditDone() //删除结束一个集合 把状态置 为-1 代表当前没有被选中的编辑条目
    }

    /**
     * 编辑完成的函数
     */
    fun onEditDone() {
        currentEditPostion = -1
    }

    //当TodoItem 列表中的条目 被选中时，传入该对象，获取它在列表中的索引位置
    fun onEditItemSelected(item: TodoItem){
        currentEditPostion = todoItems.indexOf(item)

    }


    //TodoItem编辑完成，重新给集合中的TodoItem赋值
    //id 属性值不能修改 ,进行校验
    fun onEditItemChange(item: TodoItem){
        val  currentItem =    requireNotNull(currentEditItem) //空抛异常
        require(currentItem.id == item.id){
            //false 往这里走
            "You can only change an item with the same id as currentEditItem"
        }
        todoItems[currentEditPostion] = item

    }





}

TodoComponents

package com.jmj.jetpackcomposestate.todo.four

import androidx.compose.animation.AnimatedVisibility
import androidx.compose.animation.animateContentSize
import androidx.compose.animation.core.FastOutLinearInEasing
import androidx.compose.animation.core.FastOutSlowInEasing
import androidx.compose.animation.core.TweenSpec
import androidx.compose.animation.core.animateDpAsState
import androidx.compose.animation.fadeIn
import androidx.compose.animation.fadeOut
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.RowScope
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.defaultMinSize
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.layout.widthIn
import androidx.compose.foundation.lazy.LazyRow
import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.text.KeyboardActions
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Icon
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.material3.TextButton
import androidx.compose.material3.TextField
import androidx.compose.material3.TextFieldDefaults
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.ExperimentalComposeUiApi
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.RectangleShape
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.platform.LocalSoftwareKeyboardController
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.input.ImeAction
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import com.jmj.jetpackcomposestate.todo.TodoIcon
import com.jmj.jetpackcomposestate.todo.TodoItem



/**
 * 当TodoItem 列表中的条目被选中时,会弹出一个输入框，用于编辑选中TodoItem 的信息
 * @param item 选中的TodoItem项目
 * @param onEditItemChange 编辑条目时的回调
 * @param onEditDone 编辑完成时的回调
 * @param onRemoveItem 删除条目 时的回调
 *
 */
@Composable
fun TodoItemInlineEditor(
    item: TodoItem,
    onEditItemChange:(TodoItem) ->Unit,
    onEditDone: () -> Unit ,
    onRemoveItem: (TodoItem) -> Unit
){

    TodoItemInput(
        text = item.task,
        onTextChange = {onEditItemChange(item.copy(task = it))},//it 为改变的 text 文本
        icon = item.icon,
        onIconChange = { onEditItemChange(item.copy(icon = it))  } ,//it 为改变的 icon 图标
        submit = onEditDone ,
        iconsVisible = true ,
        buttonSlot = {
            //保存和删除两个图标
            Row {
                    val shrinkButtons = Modifier.widthIn(20.dp)
                TextButton(onClick = onEditDone, modifier = shrinkButtons) {
                    Text(
                        text =  "\uD83D\uDCBE", //Emoji 符号 ，软盘
                        textAlign = TextAlign.End
                         )
                    
                }
                TextButton(onClick = {onRemoveItem(item)}, modifier = shrinkButtons) {
                    Text(
                        text =  "×",
                        textAlign = TextAlign.End,
                        color =  Color.Red
                    )

                }



            }
        }
    )



}



// 顶部输入框 加上一个 灰色背景
@Composable
fun TodoItemInputBackground(
    elevate: Boolean,//如果为True  就有一个阴影边框
    modifier: Modifier = Modifier,
    content: @Composable RowScope.() -> Unit
) {
    //帧动画的形式展现Surface底部的阴影

    val animatedElevation by animateDpAsState(if (elevate) 1.dp else 0.dp ,TweenSpec(500))


    Surface(
        color = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.05f),//设置 背景容器颜色，为黑色，透明度为0.05f
        //Surface 面版 底部有一个小小的阴影
        shadowElevation = animatedElevation, //一个委托 当发生改变的时候重构建组件
        shape = RectangleShape //设置阴影 展示动画 1dp 长方形
    ) {
        Row(
            modifier = modifier.animateContentSize(animationSpec = TweenSpec(300)),
            content = content
        )

    }
}


//输入框
@OptIn(ExperimentalMaterial3Api::class, ExperimentalComposeUiApi::class)
@Composable
fun TodoInputText(
    text: String,
    onTextChange: (String) -> Unit,
    modifier: Modifier = Modifier,
    onImeAction: () -> Unit = { }
) {

    val keyboardController = LocalSoftwareKeyboardController.current

    //输入框
    TextField(
        value = text,
        onValueChange = onTextChange,
        colors = TextFieldDefaults.textFieldColors(containerColor = Color.Transparent),
        maxLines = 1,
        modifier = modifier,
        //配置软件盘
        keyboardOptions = KeyboardOptions.Default.copy(imeAction = ImeAction.Done),
        keyboardActions = KeyboardActions(onDone = {
            //点击完成之后的回调函数
            onImeAction()
            //隐藏软键盘
            keyboardController?.hide()

        })
    )


}

//按钮
@Composable
fun TodoEditButton(
    onClick: () -> Unit,
    text: String,
    modifier: Modifier = Modifier,
    enabled: Boolean = true
) {
    TextButton(
        onClick = onClick,
        shape = CircleShape,
        colors = ButtonDefaults.buttonColors(),
        modifier = modifier,
        enabled = enabled
    ) {

        Text(text = text)

    }

}


//一排图标 ，根据文本框是否有内容，自动收起和弹出，带动画效果
@Composable
fun AnimatedIconRow(
    icon: TodoIcon,
    onIconChange: (TodoIcon) -> Unit,
    modifier: Modifier = Modifier,
    visible: Boolean = true //可见性 状态  根据我们输入是否有内容来判度是否显示
) {

    val enter = remember {
        fadeIn(animationSpec = TweenSpec(300, easing = FastOutLinearInEasing)) //300ms打开 ，预定效果器
    }//淡入动画

    val exit = remember {
        fadeOut(animationSpec = TweenSpec(100, easing = FastOutSlowInEasing))
    }//淡出动画

    Box(modifier = modifier.defaultMinSize(minHeight = 16.dp)) {//默认最小高度16dp
        AnimatedVisibility(
            visible = visible,
            enter = enter,//进入
            exit = exit //退出
        ) {//动画效果
            IconRow(icon = icon, onIconChange = onIconChange)

        }
    }

}

@Composable
fun IconRow(
    icon: TodoIcon,
    onIconChange: (TodoIcon) -> Unit,
    modifier: Modifier = Modifier
) {

    LazyRow(modifier = modifier) {

        val itemsIcon = TodoIcon.values() + TodoIcon.values()
        items(items = itemsIcon) {
            SelectableIconButton(
                icon = it.imageVector,
                iconContentDescription = it.contentDescription,
                onIconSelected = { onIconChange(it) },
                isSelected = (it == icon)

            )
        }
//        for (todoIcon in TodoIcon.values()) {
//            SelectableIconButton(
//                icon = todoIcon.imageVector,
//                iconContentDescription = todoIcon.contentDescription,
//                onIconSelected = { onIconChange(todoIcon) },
//                isSelected = (todoIcon == icon)
//
//            )
//        }
    }

}

@Composable
fun SelectableIconButton(
    icon: ImageVector,
    iconContentDescription: Int,
    onIconSelected: () -> Unit,
    isSelected: Boolean,
    modifier: Modifier = Modifier
) {
    //图标选中和未选中状态，颜色是不一样的
    val tint = if (isSelected) {
        //选择之后的颜色
        MaterialTheme.colorScheme.primary   //蓝色
    } else {
        MaterialTheme.colorScheme.onSurface.copy(alpha = 0.6f) //黑色
    }

    TextButton(
        onClick = { onIconSelected() },
        shape = CircleShape,
        modifier = modifier
    ) {

        Column {
            Icon(
                imageVector = icon,
                tint = tint,
                contentDescription = stringResource(id = iconContentDescription)// 描述 就是残障人，需要语音播报，然后通过Id找到strings.xml下的字符串播报
            )

            if (isSelected) {
                //如果被选中了  下划线
                Box(
                    modifier = Modifier
                        .padding(top = 3.dp)
                        .width(icon.defaultWidth)
                        .height(1.dp)
                        .background(tint)

                )
            } else {
                Spacer(modifier = Modifier.height(4.dp))
            }


        }


    }

}


@Composable
fun TodoItemEntryInput(onItemComplete: (TodoItem) -> Unit){


    val (text, setText) = remember { mutableStateOf("") } //屏幕旋转之后不会会保存值
    val (icon, setIcon) = remember { mutableStateOf(TodoIcon.Default) }

    val iconsVisible = text.isNotBlank()

    //点击 "add" 按钮，提交要做的事情
    val submit = {
        onItemComplete(TodoItem(text, icon))
        setText("")
    }
    TodoItemInput(
        text = text,
        onTextChange = setText,
        icon = icon,
        onIconChange = setIcon,
        submit = submit,
        iconsVisible = iconsVisible
    ){

        TodoEditButton(
            onClick = submit,
            text ="Add",
            enabled = iconsVisible
        )


    }

}



@Composable
fun TodoItemInput(text: String,
                  onTextChange: (String) -> Unit,
                  icon: TodoIcon,
                  onIconChange: (TodoIcon) -> Unit,
                  submit: () -> Unit,
                  iconsVisible: Boolean,
                    //最右侧的图标 与 按钮 在编辑时 ，会有删除和保存两个图标，添加时会有一个"Add" 按钮
                  buttonSlot : @Composable ()-> Unit
                  ) {


    if (text.isBlank()) {
        onIconChange(TodoIcon.Default)
    }

    Column {

        Row(
            Modifier
                .padding(horizontal = 16.dp)
                .padding(top = 16.dp)
        ) {
            //输入框
            TodoInputText(
                text = text,
                onTextChange = onTextChange,//setText相当于onTextChange{ text=it }他这里用了语法糖
                modifier = Modifier
                    .weight(1f)
                    .padding(end = 8.dp),
                onImeAction = submit
            )



            Spacer(modifier = Modifier.width(8.dp))


            //垂直居中
            Box(modifier = Modifier.align(Alignment.CenterVertically)){ buttonSlot() }


        }


        AnimatedIconRow(icon = icon, {
            onIconChange(it)
        }, Modifier.padding(top = 10.dp), iconsVisible)


}



}

TodoItem

package com.jmj.jetpackcomposestate.todo;

import androidx.annotation.StringRes
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.CropSquare
import androidx.compose.material.icons.filled.Done
import androidx.compose.material.icons.filled.Event
import androidx.compose.material.icons.filled.PrivacyTip
import androidx.compose.material.icons.filled.RestoreFromTrash
import androidx.compose.material.icons.filled.Square
import androidx.compose.ui.graphics.vector.ImageVector
import com.jmj.jetpackcomposestate.R
import java.util.UUID

data class TodoItem(val task:String,val icon:TodoIcon = TodoIcon.Default,val id:UUID=UUID.randomUUID())


enum class TodoIcon(
    val imageVector: ImageVector,
    @StringRes val contentDescription: Int
){
    //使用了 Material Design 的图标
    Square(Icons.Default.CropSquare, R.string.cd_expand),
    Done(Icons.Default.Done, R.string.cd_done),
    Event(Icons.Default.Event, R.string.cd_event),
    Privacy(Icons.Default.PrivacyTip, R.string.cd_privacy),
    Trash(Icons.Default.RestoreFromTrash, R.string.cd_restore);

    companion object {
        val Default = Square
    }


}

TodoAcitivity

package com.jmj.jetpackcomposestate.todo

import android.os.Bundle
import android.util.Log
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.activity.viewModels
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.livedata.observeAsState
import com.jmj.jetpackcomposestate.todo.four.TodoViewModel
import com.jmj.jetpackcomposestate.todo.four.TodoScreen


import com.jmj.jetpackcomposestate.ui.theme.JetpackComposeStateTheme


class TodoActivity : ComponentActivity() {

    private val todoViewModel by viewModels()

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            JetpackComposeStateTheme {
                TodoActivityScreen()
            }
        }
    }

    @Composable
    private fun TodoActivityScreen() {

        TodoScreen(
            items=todoViewModel.todoItems,
           currentlyEditing = todoViewModel.currentEditItem,
            onAddItem = todoViewModel::addItem,
            onRemoveItem = todoViewModel::removeItem,
            onStartEdit = todoViewModel::onEditItemSelected,
            onEditItemChange = todoViewModel::onEditItemChange,
            onEditDone = todoViewModel::onEditDone
        )

    }
}

7.状态恢复

parcelize要用的话需要插件

pluginManagement {
    repositories {
        google()
        mavenCentral()
        gradlePluginPortal()
    }

    //插件
    plugins{
        id("com.android.application")version("7.1.0-alpha05")
        id("com.android.library")version("7.1.0-alpha05")
        id("org.jetbrains.kotlin.android")version("1.5.10")
        id("org.jetbrains.kotlin.plugin.parcelize")version("1.5.10")
    }


}
dependencyResolutionManagement {
    repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
    repositories {
        google()
        mavenCentral()
    }
}

rootProject.name = "JetpackComposeState"
include(":app")

这里了才下载下来的

接下一章

你可能感兴趣的:(Androd,Jetpack,Compose,android)

android系统selinux中添加新属性property 辉色投像
1.定位/android/system/sepolicy/private/property_contexts声明属性开头：persist.charge声明属性类型：u:object_r:system_prop:s0图12.定位到android/system/sepolicy/public/domain.te删除neverallow{domain-init}default_prop:property
2.2.6 通知类控件 Toast、Menu 常思行
本文例程下载：WillFlow_Toast、WillFlowMenu一、什么是Toast？Toast也被叫做吐司，是Android系统提供的一种非常好的提醒方式，在程序中可以使用它将一些短小的信息通知给用户，它有如下两个特点：Toast是没有焦点的Toast显示的时间有限过一定的时间就会自动消失所以一般来讲Toast的使用并不会影响我们的正常操作，并且它通常不会占用太大的屏幕空间，有着良好的用户体
mac 备份android 手机通讯录导入iphone,iphone如何导出通讯录（轻松教你iPhone备份通讯录的方法）... weixin_39762838 mac 备份android 手机通讯录导入iphone
在日新月异的手机更替中，换手机已经成为一个非常稀松平常的事情，但将旧手机上面的通讯录导入到新手机还是让不少小伙伴为难，本篇将给大家详细讲解这方面的知识：“苹果手机通讯录怎么导入到新手机”及“安卓手机通讯录导入到新手机”的方法。一、苹果手机通讯录导入到新手机常用方法(SIM卡导入)在苹果手机主频幕上找到“设置”，单击进入设置菜单，下拉菜单列表，点击“邮件、通讯录、日历”，然后找到“导入SIM卡通讯录
android 更改窗口的层次,浮窗开发之窗口层级 Ms.Bu android 更改窗口的层次
最近在项目中遇到了这样的需求：需要在特定的其他应用之上悬浮自己的UI交互(拖动、输入等复杂的UI交互)，和九游的浮窗类似，不过我们的比九游的体验更好，我们越过了很多授权的限制。浮窗效果很多人都知道如何去实现一个简单的浮窗，但是却很少有人去深入的研究背后的流程机制，由于项目中浮窗交互比较复杂，遇到了些坑查看了很多资料，故总结浮窗涉及到的知识点：窗口层级关系(浮窗是如何“浮”的)？浮窗有哪些限制，如何
Android应用性能优化轻口味 Android
Android手机由于其本身的后台机制和硬件特点，性能上一直被诟病，所以软件开发者对软件本身的性能优化就显得尤为重要；本文将对Android开发过程中性能优化的各个方面做一个回顾与总结。Cache优化ListView缓存：ListView中有一个回收器，Item滑出界面的时候View会回收到这里，需要显示新的Item的时候，就尽量重用回收器里面的View；每次在getView函数中inflate新
Android实现监听事件的方法 Amy木婉清
1.通过内部类实现2.通过匿名内部类实现3.通过事件源所在类实现4.通过外部类实现5.布局文件中onclick属性(针对点击事件)1.通过内部类实现代码:privateButtonmBtnEvent;//oncreate中mBtnEvent.setOnClickListener(newOnClick());//内部类实现监听classOnClickimplementsView.OnClickLis
高级UI<第二十四篇>：Android中用到的矩阵常识 NoBugException
（1）定义在数学中，矩阵（Matrix）是一个按照长方阵列排列的复数或实数集合。由m×n个数aij排成的m行n列的数表称为m行n列的矩阵，简称m×n矩阵。记作：图片.png这m×n个数称为矩阵A的元素，简称为元，数aij位于矩阵A的第i行第j列，称为矩阵A的(i,j)元，以数aij为(i,j)元的矩阵可记为(aij)或(aij)m×n，m×n矩阵A也记作Amn。元素是实数的矩阵称为实矩阵，元素是复
RK3229_Android9.0_Box 4G模块EC200A调试 suifen_ 网络
0、kernel修改这部分完全可以参考Linux的移植：RK3588EC200A-CN【4G模块】调试_rkec200a-cn-CSDN博客1、修改device/rockchip/rk322xdiff--gita/device.mkb/device.mkindexec6bfaa..e7c32d1100755---a/device.mk+++b/device.mk@@-105,6+105,8@@en
kt文件和java文件_Java与Kotlin之间怎样进行互操作铭空间 kt文件和java文件
Java与Kotlin之间怎样进行互操作发布时间：2021-02-0210:50:43来源：亿速云阅读：98作者：小新这篇文章主要介绍了Java与Kotlin之间怎样进行互操作，具有一定借鉴价值，感兴趣的朋友可以参考下，希望大家阅读完这篇文章之后大有收获，下面让小编带着大家一起了解一下。前言目前kotlin是谷歌首推的开发Android的语言，但由于历史原因，我们绝大部分项目依旧还是以Java为主
Android shell 常用 debug 命令晨春计 Audio debug android linux
目录1、查看版本2、am命令3、pm命令4、dumpsys命令5、sed命令6、log定位查看APK进程号7、log定位使用场景1、查看版本1.1、Android串口终端执行getpropro.build.version.release#获取Android版本uname-a#查看linux内核版本信息uname-r#单独查看内核版本1.2、linux服务器执行lsb_release-a#查看Lin
2024年最全Flutter如何和Native通信-Android视角，Electron开发Android界面 2401_84544531 程序员 android 面试学习
总结【Android详细知识点思维脑图（技能树）】其实Android开发的知识点就那么多，面试问来问去还是那么点东西。所以面试没有其他的诀窍，只看你对这些知识点准备的充分程度。so，出去面试时先看看自己复习到了哪个阶段就好。虽然Android没有前几年火热了，已经过去了会四大组件就能找到高薪职位的时代了。这只能说明Android中级以下的岗位饱和了，现在高级工程师还是比较缺少的，很多高级职位给的薪
分享一个基于python的电子书数据采集与可视化分析 hadoop电子书数据分析与推荐系统 spark大数据毕设项目（源码、调试、LW、开题、PPT) 计算机源码社 Python项目大数据大数据 python hadoop 计算机毕业设计选题计算机毕业设计源码数据分析 spark毕设
作者：计算机源码社个人简介：本人八年开发经验，擅长Java、Python、PHP、.NET、Node.js、Android、微信小程序、爬虫、大数据、机器学习等，大家有这一块的问题可以一起交流！学习资料、程序开发、技术解答、文档报告如需要源码，可以扫取文章下方二维码联系咨询Java项目微信小程序项目Android项目Python项目PHP项目ASP.NET项目Node.js项目选题推荐项目实战|p
android ndk 开发jni调用对象方法，数组参数 wulongkou 开发问题安卓的事 ndk android studio jni
一、JNI和NDK关系JNI是Java语言提供的Java和C/C++相互沟通的机制，Java可以通过JNI调用本地的C/C++代码，本地的C/C++的代码也可以调用java代码。JNI是本地编程接口，Java和C/C++互相通过的接口。Java通过C/C++使用本地的代码的一个关键性原因在于C/C++代码的高效性。NDK是一系列工具的集合。它提供了一系列的工具，帮助开发者快速开发C（或C++）的动
Android jni中数组参数的传递方式 lokeyme Andriod android开发 JNI NDK java c语言
1、背景今天调试了一下Androidjni关于Java中调用C代码的程序，发现我的数组参数传递方式不对，导致值传递不正确，我的方法是：C代码，入口函数#include#includejintJava_sony_MedicalRecordDemo_MainActivity_decryptionSuccess(JNIEnv*env,jobjectthiz,jintAttr[]){returnAttr[
1-1.Jetpack 之 Navigation 简单编码模板我命由我12345 Android -Jetpack 简化编程 java java-ee android-studio android studio 安卓 android jetpack
一、Navigation1、Navigation概述Navigation是Jetpack中的一个重要成员，它主要是结合导航图（NavigationGraph）来控制和简化Fragment之间的导航，即往哪里走，该怎么走2、Navigate引入在模块级build.gradle中引入相关依赖implementation'androidx.navigation:navigation-fragment:2
Android JetPack架构——结合记事本Demo一篇打通对Sqlite的增删改查结合常用jetpack架构应用 erhtre 程序员 android jetpack 架构 sqlite
为什么要用Jetpack?========================================================================关于为什么要用Jetpack，我参考了许多的博客和官方文档，开阔了我对Android生态圈的理解和认识，在Jetpack推出前出现的许许多多强大的第三方框架与语言，典型代表无疑是强大的RxJava在Jetpack仍然有许多粉丝在一
Android干净架构MVI模板使用指南井美婵Toby
Android干净架构MVI模板使用指南android-clean-architecture-mvi-boilerplateAforkofourcleanarchitectureboilerplateusingtheModel-View-Intentpattern项目地址:https://gitcode.com/gh_mirrors/an/android-clean-architecture-mv
⭐Unity 安卓环境中正确地读取和处理 XML 文件惊鸿醉 Unity unity android xml
写了一个选择题Demo，电脑包和编辑器内无问题，但是打包安卓手机之后题目无法正常使用，想到的是安卓环境中正确地读取文件的问题改进方案：1.由于XmlDocument.Load方法在Android上的路径问题（由于文件位于APK内部，无法像在文件系统中那样直接访问），需要先使用UnityWebRequest来异步加载文件内容，然后再解析XML。2.异步处理：修改你的代码，以支持异步文件加载和处理，这
《Android进阶之光》读书笔记 soleil雪寂读书笔记 #Android进阶之光
文章目录第1章Android新特性1.1.Android5.0新特性1.2.RecyclerView1.1.4.3种Notification1.1.5.Toolbar与Palette1.1.6.Palette1.2.Android6.0新特性1.2.2.运行时权限机制1.3.Android7.0新特性第2章MaterialDesign2.2.DesignSupportLibrary常用控件详解第3
《Android进阶之光》— Android 书籍王睿丶 Android 永无止境《Android进阶之光》Android书籍 Android phoenix 移动开发
文章目录第1章Android新特性1第2章MaterialDesign48第3章View体系与自定义View87第4章多线程编程165第5章网络编程与网络框架204第6章设计模式271第7章事件总线308第8章函数响应式编程333第9章注解与依赖注入框架382第10章应用架构设计422第11章系统架构与MediaPlayer框架460出版年:2017-7简介：《Android进阶之光》是一本And
《android进阶之光》——多线程编程（上） TAING要一直努力读书笔记
今天了解了下多线程编程，知识点如下：进程与线程：进程是什么？线程是什么？进程可以看作是程序的实体，是线程的容器，是受操作系统管理的基本运行单元，例如exe文件就是一个进程。线程是进程运行的一些子任务，是操作系统调度的最小单元，各线程拥有自己的计数器，堆栈，局部变量等，也可以访问线程间共享的内存。线程的状态有哪些？新创建，可运行，等待，超时等待，阻塞，终止怎么创建一个线程？-三种方法第一种，MyTr
android进阶之光！Android面试必备的集合源码详解，系列篇程序员Sunbu 程序员 Android
前言面试：如果不准备充分的面试，完全是浪费时间，更是对自己的不负责。文末会给大家分享下我整理的Android面试专题及答案其中大部分都是大企业面试常问的面试题，可以对照这查漏补缺，当然了，这里所列的肯定不可能覆盖全部方式，不过对大家找工作肯定是有帮助！本月飞机到达上海，到今天第6天了，四家大公司华为，小米，映客，抖音，还有二家中小型公司。有几家已经面了几轮，下周还要面，挂了几家，不过目前已经选择了
Android-悬浮窗功能的实现（附Java、KT实现源码）(1) egrhef 程序员 android java 开发语言
//获取服务的操作对象valbinder=serviceasFloatWinfowServices.MyBinderbinder.service}overridefunonServiceDisconnected(name:ComponentName){}}overridefunonActivityResult(requestCode:Int,resultCode:Int,data:Intent){
Visual Studio中的Android模拟器使用详解 wurui8 android android studio android android应用
关注微信号：javalearns随时随地学Java或扫一扫随时随地学JavaMicrosoft本周发布了VisualStudio2015预览版,里面包含Android开发工具.安装的时候,如果选Android开发,VisualStudio会把调试Android应用程序用的VisualStudio模拟器也装上.在介绍这个新模拟器之前,我们先来聊一聊,为什么需要一个新的Android模拟器–当然,你也
Unity 热更之【HybirdCLR】+【YooAsset】 [安卓 Android端] [代码 + 资源热更] 功能的简单实现演示仙魁XAN Unity 进阶 unity HybirdCLR YooAsset HotUpdate 热更新
Unity热更之【HybirdCLR】+【YooAsset】[安卓Android端][代码+资源热更]功能的简单实现演示目录Unity热更之【HybirdCLR】+【YooAsset】[安卓Android端][代码+资源热更]功能的简单实现演示一、简单介绍二、HybridCLR三、YooAsset四、HybirdCLR引入工程五、YooAsset引入工程六、Python服务器简单构建七、Hybir
Android 用线程池实现一个简单的任务队列(Kotlin) 深海呐 Android #Android进阶 #Kotlin android kotlin 线程池延时任务队列线程池延时任务
关于线程池,Kotlin和java的使用方式一样在Android中,很多人喜欢用Handler的postDelayed()去实现延时任务.要使用postDelayed(),去实现延时任务队列,就不可避免要使用递归.但是这样做,代码的简洁性,和书写的简易,就远不如使用线程池.使用线程池的简单程度:privatevalmThreadPool=Executors.newSingleThreadSched
（小白入门）Windows环境下搭建React Native Android开发环境码农老黑前端 React Native 移动开发 Android studio
ReactNative(简称RN)是Facebook于2015年4月开源的跨平台移动应用开发框架，是Facebook早先开源的UI框架React在原生移动应用平台的衍生产物，目前支持iOS和Android两大平台。RN的环境搭建在RN的中文社区有所介绍，但是对于小白来说还是有些太过简略了。RN中文社区详见参考，本文不涉及的问题也许在其中能够有所解答。ReactNative思想底层引擎是JavaSc
Android Dialog圆角设置无效的问题 ly969434341 android
一，参考AndroidDialog圆角设置无效的问题https://blog.csdn.net/woshi_awei/article/details/99664527Android自定义Dialog实现通用圆角对话框https://cloud.tencent.com/developer/article/1740956二，原因Diallog的默认背景是白色（直角背景），我自定义的Dialog背景也是
MultiSnapRecyclerView：让Android RecyclerView的滚动停靠更灵活技术无疆 Android android ui android studio android-studio java androidx
在Android应用开发中，RecyclerView是一个强大且灵活的组件，用于展示大量数据集合。然而，标准的RecyclerView只支持单一的滚动停靠点，这在某些场景下可能不够灵活。为了解决这个问题，TakuSemba开发了一个名为MultiSnapRecyclerView的库，它允许开发者在RecyclerView中实现多个滚动停靠点。文章目录什么是MultiSnapRecyclerView
Android界面特效全汇总小飞鹤 Android开发详解 android
（一）Activity页面切换的效果Android2.0之后有了overridePendingTransition（），其中里面两个参数，一个是前一个activity的退出两一个activity的进入，Java代码1.@OverridepublicvoidonCreate(BundlesavedInstanceState){2.super.onCreate(savedInstanceState);
对于规范和实现，你会混淆吗？ yangshangchuan HotSpot
昨晚和朋友聊天，喝了点咖啡，由于我经常喝茶，很长时间没喝咖啡了，所以失眠了，于是起床读JVM规范，读完后在朋友圈发了一条信息： JVM Run-Time Data Areas：The Java Virtual Machine defines various run-time data areas that are used during execution of a program. So
android 网络百合不是茶网络
android的网络编程和java的一样没什么好分析的都是一些死的照着写就可以了,所以记录下来方便查找 , 服务器使用的是TomCat 服务器代码; servlet的使用需要在xml中注册 package servlet; import java.io.IOException; import java.util.Arr
[读书笔记]读法拉第传 comsci 读书笔记
1831年的时候,一年可以赚到1000英镑的人..应该很少的... 要成为一个科学家,没有足够的资金支持,很多实验都无法完成但是当钱赚够了以后....就不能够一直在商业和市场中徘徊......
随机数的产生沐刃青蛟随机数
c++中阐述随机数的方法有两种：一是产生假随机数（不管操作多少次，所产生的数都不会改变）这类随机数是使用了默认的种子值产生的，所以每次都是一样的。 //默认种子 for (int i = 0; i < 5; i++) { cout<<
PHP检测函数所在的文件名 IT独行者 PHP 函数
很简单的功能，用到PHP中的反射机制，具体使用的是ReflectionFunction类，可以获取指定函数所在PHP脚本中的具体位置。创建引用脚本。代码： [php] view plain copy // Filename: functions.php <?php&nbs
银行各系统功能简介文强chu 金融
银行各系统功能简介　业务系统核心业务系统业务功能包括：总账管理、卡系统管理、客户信息管理、额度控管、存款、贷款、资金业务、国际结算、支付结算、对外接口等清分清算系统以清算日期为准，将账务类交易、非账务类交易的手续费、代理费、网络服务费等相关费用，按费用类型计算应收、应付金额，经过清算人员确认后上送核心系统完成结算的过程国际结算系
Python学习1(pip django 安装以及第一个project) 小桔子 python django pip
最近开始学习python,要安装个pip的工具。听说这个工具很强大，安装了它，在安装第三方工具的话so easy!然后也下载了，按照别人给的教程开始安装，奶奶的怎么也安装不上！第一步：官方下载pip-1.5.6.tar.gz, https://pypi.python.org/pypi/pip easy! 第二部：解压这个压缩文件，会看到一个setup.p
php 数组 aichenglong PHP 排序数组循环多维数组
1 php中的创建数组 $product = array('tires','oil','spark');//array()实际上是语言结构而不是函数 2 如果需要创建一个升序的排列的数字保存在一个数组中，可以使用range()函数来自动创建数组 $numbers=range(1,10)//1 2 3 4 5 6 7 8 9 10 $numbers=range(1,10,
安装python2.7 AILIKES python
安装python2.7 1、下载可从 http://www.python.org/进行下载#wget https://www.python.org/ftp/python/2.7.10/Python-2.7.10.tgz 2、复制解压 #mkdir -p /opt/usr/python #cp /opt/soft/Python-2
java异常的处理探讨百合不是茶 JAVA异常
//java异常 /* 1，了解java 中的异常处理机制，有三种操作 a,声明异常 b,抛出异常 c,捕获异常 2，学会使用try-catch-finally来处理异常 3，学会如何声明异常和抛出异常 4，学会创建自己的异常 */ //2，学会使用try-catch-finally来处理异常
getElementsByName实例 bijian1013 element
实例1： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/x
探索JUnit4扩展：Runner bijian1013 java 单元测试 JUnit
参加敏捷培训时，教练提到Junit4的Runner和Rule，于是特上网查一下，发现很多都讲的太理论，或者是举的例子实在是太牵强。多搜索了几下，搜索到两篇我觉得写的非常好的文章。文章地址：http://www.blogjava.net/jiangshachina/archive/20
[MongoDB学习笔记二]MongoDB副本集 bit1129 mongodb
1. 副本集的特性 1)一台主服务器(Primary),多台从服务器(Secondary) 2)Primary挂了之后，从服务器自动完成从它们之中选举一台服务器作为主服务器，继续工作，这就解决了单点故障，因此，在这种情况下，MongoDB集群能够继续工作 3)挂了的主服务器恢复到集群中只能以Secondary服务器的角色加入进来 2
【Spark八十一】Hive in the spark assembly bit1129 assembly
Spark SQL supports most commonly used features of HiveQL. However, different HiveQL statements are executed in different manners: 1. DDL statements (e.g. CREATE TABLE, DROP TABLE, etc.)
Nginx问题定位之监控进程异常退出 ronin47
nginx在运行过程中是否稳定，是否有异常退出过？这里总结几项平时会用到的小技巧。 1. 在error.log中查看是否有signal项，如果有，看看signal是多少。比如，这是一个异常退出的情况： $grep signal error.log 2012/12/24 16:39:56 [alert] 13661#0: worker process 13666 exited on s
No grammar constraints (DTD or XML schema).....两种解决方法 byalias xml
方法一：常用方法关闭XML验证工具栏：windows => preferences => xml => xml files => validation => Indicate when no grammar is specified:选择Ignore即可。方法二：（个人推荐）添加内容如下 <?xml version=
Netty源码学习-DefaultChannelPipeline bylijinnan netty
package com.ljn.channel; /** * ChannelPipeline采用的是Intercepting Filter 模式 * 但由于用到两个双向链表和内部类，这个模式看起来不是那么明显，需要仔细查看调用过程才发现 * * 下面对ChannelPipeline作一个模拟，只模拟关键代码： */ public class Pipeline {
MYSQL数据库常用备份及恢复语句 chicony mysql
备份MySQL数据库的命令，可以加选不同的参数选项来实现不同格式的要求。 mysqldump -h主机 -u用户名 -p密码数据库名 > 文件备份MySQL数据库为带删除表的格式，能够让该备份覆盖已有数据库而不需要手动删除原有数据库。 mysqldump -–add-drop-table -uusername -ppassword databasename > ba
小白谈谈云计算--基于Google三大论文 CrazyMizzz Google 云计算 GFS
之前在没有接触到云计算之前，只是对云计算有一点点模糊的概念，觉得这是一个很高大上的东西，似乎离我们大一的还很远。后来有机会上了一节云计算的普及课程吧，并且在之前的一周里拜读了谷歌三大论文。不敢说理解，至少囫囵吞枣啃下了一大堆看不明白的理论。现在就简单聊聊我对于云计算的了解。我先说说GFS &n
hadoop 平衡空间设置方法 daizj hadoop balancer
在hdfs-site.xml中增加设置balance的带宽，默认只有1M： <property> <name>dfs.balance.bandwidthPerSec</name> <value>10485760</value> <description&g
Eclipse程序员要掌握的常用快捷键 dcj3sjt126com 编程
判断一个人的编程水平，就看他用键盘多，还是鼠标多。用键盘一是为了输入代码（当然了，也包括注释），再有就是熟练使用快捷键。曾有人在豆瓣评《卓有成效的程序员》：“人有多大懒，才有多大闲”。之前我整理了一个程序员图书列表，目的也就是通过读书，让程序员变懒。程序员作为特殊的群体，有的人可以这么懒，懒到事情都交给机器去做，而有的人又可以那么勤奋，每天都孜孜不倦得
Android学习之路 dcj3sjt126com Android学习
转自：http://blog.csdn.net/ryantang03/article/details/6901459 以前有J2EE基础，接触JAVA也有两三年的时间了，上手Android并不困难，思维上稍微转变一下就可以很快适应。以前做的都是WEB项目，现今体验移动终端项目，让我越来越觉得移动互联网应用是未来的主宰。下面说说我学习Android的感受，我学Android首先是看MARS的视
java 遍历Map的四种方法 eksliang java HashMap java 遍历Map的四种方法
转载请出自出处： http://eksliang.iteye.com/blog/2059996 package com.ickes; import java.util.HashMap; import java.util.Iterator; import java.util.Map; import java.util.Map.Entry; /** * 遍历Map的四种方式
【精典】数据库相关相关 gengzg 数据库
package C3P0; import java.sql.Connection; import java.sql.SQLException; import java.beans.PropertyVetoException; import com.mchange.v2.c3p0.ComboPooledDataSource; public class DBPool{
自动补全 huyana_town 自动补全
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml&quo
jquery在线预览PDF文件，打开PDF文件天梯梦 jquery
最主要的是使用到了一个jquery的插件jquery.media.js，使用这个插件就很容易实现了。核心代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.
ViewPager刷新单个页面的方法 lovelease android viewpager tag 刷新
使用ViewPager做滑动切换图片的效果时，如果图片是从网络下载的，那么再子线程中下载完图片时我们会使用handler通知UI线程，然后UI线程就可以调用mViewPager.getAdapter().notifyDataSetChanged()进行页面的刷新，但是viewpager不同于listview，你会发现单纯的调用notifyDataSetChanged()并不能刷新页面
利用按位取反（~）从复合枚举值里清除枚举值草料场 enum
以 C# 中的 System.Drawing.FontStyle 为例。如果需要同时有多种效果，如：“粗体”和“下划线”的效果，可以用按位或（|） FontStyle style = FontStyle.Bold | FontStyle.Underline; 如果需要去除 style 里的某一种效果，
Linux系统新手学习的11点建议刘星宇编程工作 linux 脚本
　　随着Linux应用的扩展许多朋友开始接触Linux，根据学习Windwos的经验往往有一些茫然的感觉：不知从何处开始学起。这里介绍学习Linux的一些建议。　　一、从基础开始：常常有些朋友在Linux论坛问一些问题，不过，其中大多数的问题都是很基础的。例如：为什么我使用一个命令的时候，系统告诉我找不到该目录，我要如何限制使用者的权限等问题，这些问题其实都不是很难的，只要了解了 Linu
hibernate dao层应用之HibernateDaoSupport二次封装 wangzhezichuan DAO Hibernate
/** * 方法描述:sql语句查询返回List<Class> * 方法备注: Class 只能是自定义类 * @param calzz * @param sql * @return * 创建人：王川 * 创建时间：Jul

JetpackCompose 之 状态学习

1.无状态组件

1.1导入依赖

1.2 数据类

2.重组

3.MutableState

4. 软键盘

5.输入框背景

6.编辑模式

7.状态恢复

你可能感兴趣的:(Androd,Jetpack,Compose,android)

JetpackCompose 之状态学习