Gena
так фабрик же про это
Нет. В этом и печаль. ( Тут есть несколько проблем (по крайней мере я так вижу): 1. Фабрик ещё глубже и больше расчитан на асинхронность и декларативность, по сути он переносит модель react в натив. Т.е. вместо того, чтоб уровнем ниже react'а было что-то типа DOM, как в вебе, там строят ещё один реакт. 2. Фабрик + TM делают это на уровне C++, что на Android ещё усугубляет весь процесс. Там из нативного кода ещё информацию и в JVM (ну не jvm, в art или что там у них), прокидывать надо, и там примерно та же проблема что с прокидной данных из JS в натив...
Gena
Вообще у меня, пока я тут копаюсь, всё больше видение сдвигается в сторону того, что в Android нельзя делать через NDK это. Надо JS компилить в JVM вместе с движком, только так и тогда можно будет написать на JS прямой и быстрый вызов в Java.
Gena
Т.е. это должен быть компилятор JS, AOT. При том тот, который умеет две цели хотя бы: JVM для Android и C++ (лучше чисто C, хотя всё равно это будет в современных реалиях LLVM IR) для iOS.
Сергій
🙃
Gena
почему нельзя?
Потому что из NDK не доступен UI... вообще никак. Ну верней, там можно vulkan, opengl на весь экран.
Aleksei
а какие есть кейсы чтобы размер родителя по размеру ребенка делать из нативки? чет вот сижу думаю и не могу с ходу придумать 🙂
Aleksei
я вот недавно в surface игрался немного, по размеру safe area layout guide поставил норм :)
Gena
а какие есть кейсы чтобы размер родителя по размеру ребенка делать из нативки? чет вот сижу думаю и не могу с ходу придумать 🙂
SafeArea, подойдет? ) На самом деле любой лэйаут может этого хотеть... Свой Text компонент... к примеру супер быстрый Label
Gena
Ну вот мне не хватает обычного inline лэйаута очень из веба и как ни крути, я его сейчас не могу сделать не форкая RN и не встраивая это централизовано в yoga.
Aleksei
а как ты видишь решение? и почему обязательно на UI треде должно быть (в смысле не асинхронное)?
Gena
а как ты видишь решение? и почему обязательно на UI треде должно быть (в смысле не асинхронное)?
Потому что, если мы хотим, чтоб UI рисовался стандартный, системный, надо работать по его правилам. Одно из правил обоих UI что на ios, что на Android (SwiftUI в расчет не беру пока, с ним не очень ещё понятно что будет), так вот, одно из правил - это схема общёта лэйаута, она практически не отличается - два прхода сверху вниз и снизу вверх по иерархии и они синхронные, системе лэйаута ответ на вопрос "сколько ты хочешь занять" и "сколько ты займешь, если у тебя есть столько то места" от вьюшки нужен здесь и сейчас, а не когда нибудь в другом треде. Дальше, система респондеров... сейчас дествие и мне сейчас надо на него отреагировать... возможно заодно начать какую-то операцию (это можно и офлоадить куда-то), но отреагировать надо сейчас в смысле обратной связи пользователю. Анимации опять же... то же самое...
Gena
Поэтому на UI треде. Для тяжелых обсчетов и других операций, система должна предоставлять программисту возможность сделать это в отдельном потоке, что бы им ни было... в воркере, к примеру если js брать.
Gena
А решение... ктож его знает... знал бы кто, уже сделали бы )
Aleksei
а как ты узнал (я правда если что не знаю), что в том же ios синхронно рассчитываются констрейнты?
Aleksei
учитывая что те же анимации точно вообще в отдельном демоне работают
Gena
а как ты узнал (я правда если что не знаю), что в том же ios синхронно рассчитываются констрейнты?
констренты, кстати, могут и не синхронно. Я имею ввиду старую систему, которой они так или иначе пользуются.
Aleksei
констренты, кстати, могут и не синхронно. Я имею ввиду старую систему, которой они так или иначе пользуются.
ну вот похоже что просто так это все невозможно встроить в иерархию обычных вьюх, вот и строят свою систему, по опыту asyncdisplaykit :)
Alexsandr
тут не много накостыленно, сори вчера не очень чуствовал вечером 🙂
Alexsandr
если что даты можно взять больше чем на пару месяцев
Alexsandr
типо на год
Alexsandr
вообщем развлекайтесь
Gena
ну вот похоже что просто так это все невозможно встроить в иерархию обычных вьюх, вот и строят свою систему, по опыту asyncdisplaykit :)
Это в догонку, очень долго статью искал ) Вот эта система (она лежит в основе лэйаута в ios и она синхронная): https://developer.apple.com/documentation/uikit/uiview/1622482-layoutsubviews?language=objc То, что при этом сама отрисовка у них построена на слоях и скорей всего реальный рендеринг вытащен из UI потока, вообще не видно снаружи... Если что, вот здесь немного описано ещё https://www.objc.io/issues/3-views/advanced-auto-layout-toolbox/#the-layout-process (специально искал древнюю статью, т.к. в новых про это уже не вспоминают почти)
Yaroslav
Ребята, подскажите. Могу ли я через свое приложение управлять музыкой, которая проигрывается через любое другое приложение? Так как это делают наушники, например.
Yaroslav
Нужно свой девайс подключить через BLE, что бы управлять музыкой, так как это делают наушники/часы, еще что то
Gena
https://github.com/mnshkv/scroll-example @GeorgeWizeman @ivan3177
Так вот тут как раз оба пункта, если я правильно понял: 1 - допущение, что увеличенный айтем "не раздвигает" собой остальные, т.е. только transform 2 - оконность, да ) Хотя про п.1 я сейчас подумал, что теоретически можно было бы попробовать наложить на все айтемы ещё трансформ, сдвигающий их на константу: если слева от выделенного, то влево, если справа от выделенного, то вправо, а центральный сдвигать на 0, он и так скейлится. И получится более менее то, что надо, но такое либо в js считать, либо на reanimated писать наверное...
Kotuhan
https://github.com/mnshkv/scroll-example @GeorgeWizeman @ivan3177
Огонь 🙂 snapToInterval мне особо зашел. В целом осталось только добавить анимацию translateY чтобы элементы оставались basline и прям совсем оно Спасибо 🙂 То что сегодня сам успел уже было написать (часть логики отвечающая за скейл) выглядит вот так const ITEM_WIDTH = 70; const HALF = DIMENSIONS.halfWidth; const getStartPoint = (idx: number) => idx * ITEM_WIDTH - HALF; const getMiddlePoint = (idx: number) => (idx + 1) * ITEM_WIDTH - HALF; const getEndPoint = (idx: number) => (idx + 2) * ITEM_WIDTH - HALF; const scale = animated.interpolate({ inputRange: [getStartPoint(idx), getMiddlePoint(idx), getEndPoint(idx)], outputRange: [1, 1.2, 1], extrapolate: "clamp" }); тут несколько моментов - изначальный скейл = 1 - нет особого смысла дефолтным скейлом нагружать Ну и айтемы берутся 0,1,2 - потому что брать -1 айтем смысла особого нет.
Evgeniy
Добрый день. Подскажите, пожалуйста, может кто сталкивался с ошибкой: Native textinput is 4 events ahead of js - try to make your js faster? Происходит при вводе текста на реальном девайсе (только ios). Соответственно сопровождается подвисанием.
Irakliy
изменения в инпуте появляются быстрее, чем они успевают отрисовваться
Sergey
Чек метод onTextChanged (или как он там), скорее всего там что-то очень тяжелое и js не поспевает
Irakliy
насколько критично - хз
Sergey
Примеры кода значительно облегчат процесс помощи
Irakliy
у меня, кстати, тоже такая хрень была, когда я хуки из любопытства ковырял
Evgeniy
<TextInput style={styles.input} placeholder={'Введите текст...'} value={this.removeEmojis(this.state.message)} maxHeight={80} selectionColor={colors.accent_color} multiline textAlignVertical={"center"} onChangeText={(message) => this.handleShowWriting(message)} keyboardType={Platform.OS === 'android' ? 'email-address' : 'ascii-capable'} />
Evgeniy
я думал что это из-за setState
Irakliy
появляется, если на инпуте есть onChangeText который вносит изменения в хук стейт (или как это правильно назвать)
Evgeniy
Не нужна? Подскажите, как правильнее?
Irakliy
я тоже всегда стрелочную помещал, а разве можно как-то по-другому передать вводимый текст?
Stanislav
В этом случае стрелочная же имеет такой же интерфейс как и хендлер ваш. Почему сразу хендлер не передавать?
Danila
onChangeText={this.handleShowWriting}
Stanislav
Да
Stanislav
Только this привязать либо в конструкторе, либо сразу как стрелочную ф-ю объявить
Evgeniy
onChangeText={this.handleShowWriting(message)} так будет сообщение передаваться?
Stanislav
Выше правильно написали
Evgeniy
ок, попробую
Irakliy
офигеть, работает😄
Irakliy
спасибо, ребят, не думал, что так можно
Evgeniy
Да, работает. но мою проблему не решает. думал может это дает нагрузку
Vadim
Посоветуйте сервисы для тестирования приложения на реальных устройствах. Чтобы по деньгам более-менее. И можно было в автоматические тесты. Спасибо.
Stanislav
Да, работает. но мою проблему не решает. думал может это дает нагрузку
value={this.removeEmojis(this.state.message)} а тут какой-то особый кейс, при котором надо так делать? почему сразу в стейт не класть с removeEmojis?
Nick
я тоже всегда стрелочную помещал, а разве можно как-то по-другому передать вводимый текст?
либо в конструкторе через bind, либо при определении метода делать вот так: myMethod = () => { ... } вместо myMethod () { ... } при использовании хуков эти танцы с бубном не нужны и можно просто передавать функцию как пропс, без дополнительно обертки дополнительные обертки, читай, генерация функций во время рендера – плохо для памяти, GC отработает, конечно, но зачем лишний раз перегружать?
Sergey
Да, работает. но мою проблему не решает. думал может это дает нагрузку
2 вопроса: весь компонент - это вот этот текстинпут, или там еще куча всего, что ререндерится на каждый сетСтейт? Что находится в this.handleShowWriting ?
Sergey
А, еще нет ли какой-то лютой логики в removeEmojis?
Stanislav
типа: const [data, setData] = useState() … value={data} onChangeText={setData} ?
да, в функциональном компоненте и useState('')
Nick
типа: const [data, setData] = useState() … value={data} onChangeText={setData} ?
ну если есть желание только вызвать setData, то да, можно в атрибут стрелочную сунуть, но это хуже читается
Gena
Да, работает. но мою проблему не решает. думал может это дает нагрузку
Потому что у вас проблема может быть где угодно. Примерно во время ввода текста в js выполняется очень много кода синхронного, что блокирует runloop и откладывает вызов обработчиков событий из натива. Как искать? Можно попробовать профилировать в chrome...
Nick
я обычно внутри компонента создаю функцию, что-то типа const handleMyEvent = () => { setData(data) } и ее уже передаю в пропсы
Irakliy
чтобы можно было ещё какие-то действия проводить?
Nick
а зачем в этом случае доп/ обертка?
для читаемости. она так и так есть, а так вызов компонента компактнее и функцию потом можно расширять
Vitaly
Привет сталкивался ли кто с неработающим hot reload в 0,60 при использовании функциональных компонентов?
Irakliy
а если надо что-то более универсальное? например, у нас несколько свойств стейта, не писать же каждый раз новую функцию? а что-то вроде handleEvent = (val, func) => { func(val) } без стрелочной функции уже не вызвать, ибо надо два аргумента передать
Nick
а если надо что-то более универсальное? например, у нас несколько свойств стейта, не писать же каждый раз новую функцию? а что-то вроде handleEvent = (val, func) => { func(val) } без стрелочной функции уже не вызвать, ибо надо два аргумента передать
а что мешает сделать так? const handler = (val1, val2) => { ... } return <MyComponent onSomething={handler}/> универсальные коллбеки – довольно хреновая практика и поддерживаемость такого кода резко снижается. мест, где они были бы нужны, не так много
Nick
выходит, на каждое свойство стейта отдельную функцию делать? что-то я не очень понял
ну если про хуки говорить, то ты и так на каждое свойство стейта создаешь функцию через useState(). по сути там и свойств-то нет. каждый кусок стейта – отдельная переменная + сеттер к ней. здесь же вопрос в обработке событий компонента, говоря про функциональные компоненты, есть два подхода: <MyComponent onSomething={() => setData()}/> и const handler = (val1, val2) => { ... } <MyComponent onSomething={handler}/> глобально они ничем не отличаются, обоих случаях создается функция-обработчик, которая передается в компонент, порсто в первом случае эта функция создается в момент вызова компонента, во втором случае - заранее я считаю подход с объявлением функции прямо в пропсах "грязным". но это лично мое мнение и я стараюсь обработчики, передаваемые компоненту, всегда выносить в отдельные функции
Nick
точнее даже не в момент вызова, а в момент генерации через React.createElement. но разницы, по сути, нет
Irakliy
ну если про хуки говорить, то ты и так на каждое свойство стейта создаешь функцию через useState(). по сути там и свойств-то нет. каждый кусок стейта – отдельная переменная + сеттер к ней. здесь же вопрос в обработке событий компонента, говоря про функциональные компоненты, есть два подхода: <MyComponent onSomething={() => setData()}/> и const handler = (val1, val2) => { ... } <MyComponent onSomething={handler}/> глобально они ничем не отличаются, обоих случаях создается функция-обработчик, которая передается в компонент, порсто в первом случае эта функция создается в момент вызова компонента, во втором случае - заранее я считаю подход с объявлением функции прямо в пропсах "грязным". но это лично мое мнение и я стараюсь обработчики, передаваемые компоненту, всегда выносить в отдельные функции
а если так тогда: `const handler = func => val => { func(val) } onSomething={handler(setSomething)}
Nick
тоже можно, но, опять же, редкий кейс. такое может быть полезно при рендере каких-нибудь списков или чего-то подобного. в условно простых компонентах это излишне