5. React Native – Основы. ScrollView, Picker, ActivityIndicator и Slider

В прошлой заметке мы начали рассматривать элементы разметки приложений и в этот раз посмотрим еще на некоторые из них <ScrollView>, <Picker>, <ActivityIndicator> и <Slider> . <ScrollView> – служит оберткой для контента и если контент имеет больший размер, чем размеры экрана устройства, он позволяет скролить контент. <Picker> – создает на странице элемент напоминающий обычный тег select в HTML. <ActivityIndicator>  – отображает на странице классический прелоадер в виде вращающегося разорванного круга. <Slider> – создает на странице ползунок, двигая который можно менять значение необходимого параметра. В блоках кода ниже можно увидеть как данные модули используются в работе.

Узнать больше

4. React Native – Основы. TextInput и Button

Продолжим рассмотрение элементов и модулей фреймворка React Native. В качестве основных элементов для разметки страниц приложения используются теги <View> и <Text> это аналог <div> и <span> в HTML разметке. Для создания текстовых полей и стандартных кнопок служат теги <TextInput> и <Button>. В приведенном ниже примере показан вариант их использования.

Узнать больше

3. React Native – Основы. Компоненты

В данной заметке рассмотрим одну из самых важных тем в работе с фреймворком, обратим свой взор на Компоненты . Приложение состоит из них как из кирпичиков, которые по отдельности выполняют каждый свою задачу. Очень важно еще на этапах проектирования приложения разбить его на отдельные компоненты и организовать правильно взаимодействие между ними. В приведенных для примера ниже блоках кода представлены компоненты, которые являются дочерними родительскому компоненту с классом App, последний пример в самом низу страницы.

Узнать больше

2. React Native – Основы. StyleSheet

После того как закончили устанавливать и настраивать для изучения React Native, рассмотрим первую тему  – оформление приложений. За это отвечает модуль StyleSheet. В React Native нет возможности использовать классические свойства CSS и данный модуль позволяет решить данную проблему. Описание свойств элементов выглядит как обычный объект c полями имеющие названия очень похожие на свойства CSS. По сравнению с CSS количество данных свойств значительно меньше.

Узнать больше

1. React Native – Основы. Установка

Всем Привет! Начинаю публикацию заметок посвященную React Native. Нет такого направления в которое бы не запустил свои длинные руки JavaScript и на этот раз он добрался до нативной разработки мобильных приложений для устройств работающих под управлением Android и iOS. В отличии от React Native, подобные фреймворки весь код транслируют в WebView и остаются по сути веб приложениями, в React Native происходит компиляция разрабатываемого кода в нативную реализацию, как будто приложение написано на Java или Objective-C. В первой заметке я затронул установку, если честно, очень трудозатратное занятие, пришлось потратить массу времени чтобы со всем разобраться. Здесь собрал только самые важные команды, но если делаете это в первый раз советую обратиться к документации.
Узнать больше

15. Electron.js – Основы. Electron API – Online/Offline Status, Battery Status

Это последняя заметка в которой я  рассматриваю Electron API, здесь будут показана реализация отслеживания online и offline состояния сети  и  Battery Status – состояние батареи если приложение запускается на ноутбуке. Online и offline события состояния сети и Battery Status являются частью стандартного API в HTML5.

Online/Offline Status

main.js

Узнать больше