<MyRusakov.ru />

Программирование на C++ в Unreal Engine 5

Программирование на C++ в Unreal Engine 5

Данный курс научит Вас созданию игр на C++ в Unreal Engine 5. Курс состоит из 12 разделов, в которых Вас ждёт теория и практика. Причём, в качестве практики будет создан весьма крупный проект объёмом свыше 5000 строк качественного кода, который уже на практике познакомит Вас с принципами создания игр на C++ в Unreal Engine 5.

Параллельно с курсом Вы также будете получать домашние задания, результатом которых станет, в том числе, полноценная серьёзная работа для портфолио.

Помимо самого курса Вас ждёт ещё и очень ценный Бонус: «Тестирование Unreal-проектов на Python», в рамках которого Вы научитесь писать очень полезные тесты для тестирования самых разных аспектов разработки игр.

Подробнее
Подписка

Подпишитесь на мой канал на YouTube, где я регулярно публикую новые видео.

YouTube Подписаться

Подписавшись по E-mail, Вы будете получать уведомления о новых статьях.

Подписка Подписаться

Добавляйтесь ко мне в друзья ВКонтакте! Отзывы о сайте и обо мне оставляйте в моей группе.

Мой аккаунт Мой аккаунт Моя группа
Опрос

Какая тема Вас интересует больше?

Работа с анимациями в Android Jetpack Compose

Работа с анимациями в Android Jetpack Compose

Здравствуйте! В сегодняшней статье мы поговорим о создании анимаций в Jetpack Compose. Вы узнаете, как добавить плавные визуальные эффекты в интерфейс Android-приложения, какие API предоставляет Compose и как управлять переходами состояний.

Что такое анимации в Jetpack Compose?

Анимации — это способ сделать интерфейс более живым и отзывчивым. С помощью анимаций можно визуально подчеркнуть изменение состояния, привлечь внимание пользователя или просто сделать взаимодействие с приложением более приятным.

Шаг 1: Простые анимации с animate*AsState

Самый простой способ реализовать анимацию в Compose — использовать функции вида animateFloatAsState, animateDpAsState и т.п.

@Composable
fun SimpleAnimation() {
    var expanded by remember { mutableStateOf(false) }
    val size by animateDpAsState(targetValue = if (expanded) 200.dp else 100.dp, label = "")

    Box(
        modifier = Modifier
            .size(size)
            .background(Color.Cyan)
            .clickable { expanded = !expanded }
    )
}

При клике размер блока плавно меняется — просто и удобно!

Шаг 2: Анимация нескольких параметров с updateTransition

Если нужно анимировать сразу несколько свойств, используйте updateTransition. Это позволяет группировать анимации и синхронизировать их.

@Composable
fun MultiAnimation() {
    var selected by remember { mutableStateOf(false) }
    val transition = updateTransition(targetState = selected, label = "")

    val color by transition.animateColor(label = "") { if (it) Color.Red else Color.Gray }
    val corner by transition.animateDp(label = "") { if (it) 30.dp else 0.dp }

    Box(
        modifier = Modifier
            .size(120.dp)
            .background(color, shape = RoundedCornerShape(corner))
            .clickable { selected = !selected }
    )
}

Такой подход отлично подходит для визуального переключения состояний компонентов.

Шаг 3: Анимации появления и исчезновения

Для анимации видимости компонентов используйте AnimatedVisibility.

@Composable
fun VisibilityAnimation() {
    var visible by remember { mutableStateOf(true) }

    Column(horizontalAlignment = Alignment.CenterHorizontally) {
        Button(onClick = { visible = !visible }) {
            Text("Показать / Скрыть")
        }

        AnimatedVisibility(visible = visible) {
            Text("Я появляюсь с анимацией!")
        }
    }
}

Эффект может быть дополнен анимацией масштабирования, альфы и т.д.

Шаг 4: Неограниченные возможности с Animatable

Если нужно больше контроля — используйте Animatable и launch в корутине.

@Composable
fun ManualAnimation() {
    val offsetX = remember { Animatable(0f) }

    LaunchedEffect(Unit) {
        offsetX.animateTo(
            targetValue = 300f,
            animationSpec = tween(durationMillis = 1000)
        )
    }

    Box(
        modifier = Modifier
            .offset { IntOffset(offsetX.value.toInt(), 0) }
            .size(60.dp)
            .background(Color.Green)
    )
}

Этот способ хорош для кастомных и последовательных анимаций.

Заключение

Jetpack Compose предлагает широкий спектр инструментов для работы с анимациями — от простых до продвинутых. Используйте их, чтобы сделать интерфейс вашего приложения более живым, интуитивным и приятным для пользователя.

Хотите углубиться в Compose и построение UI? Тогда рекомендуем видеокурс Создание приложений для Android с нуля.

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Порекомендуйте эту статью друзьям:

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

  1. Кнопка:

    Она выглядит вот так: Как создать свой сайт

  2. Текстовая ссылка:

    Она выглядит вот так: Как создать свой сайт

  3. BB-код ссылки для форумов (например, можете поставить её в подписи):

Комментарии (0):

Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.