Уроки React Native

#4 – Написание стилей для приложения

#4 – Написание стилей для приложения

Для создания красивого дизайна требуется прописывать стили к объектам. В ходе урока мы познакомимся с написанием стилей в React Native, рассмотрим особенности их написания и дополнительно изучим технологию FlexBox.

Відеоурок

Telegram group

Підписуйтесь на нашу групу в Телеграмі 🇺🇦

Использование CSS

В React Native не используется язык стилей CSS. Вместо него вы можете использовать язык программирования JavaScript и создавать объекты на его основе. В качестве названий свойств вы указываете схожие названия с языком CSS, а в качестве значений вы указываете так же схожие названия значений из языка CSS. 


Язык CSS хоть и не используется в React Native, но его синтаксис используется повсеместно для создания дизайна приложения.


Написание стилей

Все стили необходимо помещать внутрь отдельного объекта. Пример такого объекта представлен ниже:

const styles = StyleSheet.create({
	container: {
		flex: 1,
		backgroundColor: '#fff',
		alignItems: 'center',
		justifyContent: 'center',
	}
});

Стили, что указаны выше очень схожи с CSS стилями за исключением того, что это JS объект. Подобные стили можно добавлять к любым компонентам. Пример добавления стилей:

<View style={styles.container}></View>

Матеріали для курсу

Щоб завантажувати матеріали до відеокурсів, необхідно оформити підписку на сайт

Вихідний код

Весь код буде доступний після підписки на проект!

Завдання до уроку

Необхідно оформити передплату на проект, щоб отримати доступ до всіх домашніх завдань

Велике завдання за курсом

Вам необхідно оформити передплату на сайті, щоб мати доступ до всіх великих завдань. У завдання входить методика рішення, а також готовий проект з відповіддю до завдання.
PS: подібні завдання доступні при підписці від 1 місяця

Також варто подивитися

Практика React JS / Разработка магазина (eCommerce)
9 уроків
Курс по React JS для начинающих
11 уроків
Изучение React JS / Redux библиотеки
9 уроків
Фреймворк Next JS / Изучение NextJS для начинающих
8 уроків
Создание приложения на React JS / Использование API
7 уроків
MERN Stack / Разработка веб-приложения
9 уроків
Коментарі
Додати коментар

Поки що коментарів немає