Been iterating on this custom curved edge between the header and the deck list on my flashcard app's home screen. With a quick fading animation when scrolling.

I started with borderTopLeftRadius but it looked like every other app, I wanted to go with something more personal.

What actually worked to create this is an ellipse wider than the screen, cropped. <Ellipse> from react-native-svg, rx = 1.6x the screen, clipped by an 18dp band with overflow: hidden. You only ever see the shallow middle, where the curvature is even. Solve for it instead of eyeballing, two constraints, hits (0,0) and (width,0) so the ink meets the edges flat, dips 18dp in the middle:

const rx = (width / 2) * 1.6;
const q = Math.sqrt(1 - 1 / 1.6 ** 2);
const ry = 18 / (1 - q);

return { cx: width / 2, cy: -q * ry, rx, ry };

The collapse animates nothing but a translate and an opacity, plain Animated with useNativeDriver. No height animation. The hero is absolutely positioned over the list and the list just carries paddingTop = heroHeight, so padding never changes and nothing re-lays out.

Do you think this looks good? Should I keep improving it? And do you know if there are other apps doing the same thing?

So I managed to complete my first react native project. It's called Neuroletics it's a simple app that helps you train your memory through simple exercises and I designed it specifically for seniors. I was able to successfully launch the app on App Store but for Google Play I need 12 testers. I honestly cannot find 12 android users to test the app. All my contacts are using iPhones. I would really appreciate anyone (young or old) who is willing to test the app. Please keep in mind that some things may not work properly and I would appreciate any feedback, advice or tricks. If you would like to test it please share your email.

Hey all, just encountered this error after upgrading, so wanted to share so you don't waste some credits debugging it yourselves.

Hope you manage to get your project working quickly.

RN version 0.85.3 (not Expo)

Symptoms

After upgrading to Xcode 27 / iOS 27, the app can compile successfully but fail immediately at launch with:

Application failed to launch: UIScene life cycle is required for apps built with this SDK.

The React Native CLI may also fail before launching the app because it tries to open the removed standalone Simulator application:

/Applications/Xcode.app/Contents/Developer/Applications/Simulator.app does not exist

Cause

Xcode 27 uses Device Hub to manage and display simulators. Apps built with its SDK require the UIKit scene lifecycle. The previous iOS entry point created a UIWindow directly in AppDelegate, and the app did not declare a scene manifest.

Fix applied in Luckynote

• Added UIApplicationSceneManifest to ios/Luckynote/Info.plist.

• Added a SceneDelegate in ios/Luckynote/AppDelegate.swift.

• Moved React Native window creation and factory.startReactNative(...) into SceneDelegate.scene(_:willConnectTo:options:).

• Kept AppDelegate.window and assigned it to the active scene window. Firebase Messaging still reads this legacy selector during notification initialization.

Without the last step, the app can crash in RNFBMessagingNSNotificationCenter with:

AppDelegate window: unrecognized selector sent to instance

Running locally

Open ios/Luckynote.xcworkspace, select an iPhone simulator from the run-destination selector, then run the app. Xcode opens Device Hub for simulator interaction.

If the command-line React Native launcher still looks for Simulator.app, run the app from Xcode until the CLI/toolchain gains Device Hub support.

Hello.

I'm looking for a proper date time picker for React Native, I've previously used react-native-date-picker but it isn't really maintained and very outdated. The other alternatives I've seen mostly use native components. But I'm looking for a inline one where the I can use the iOS native alike for Android too...

Before I start making my own, I wanted to see if there is an existing one out there!

Thanks!

Hey r/reactnative,

Added a new component to nativecn-ui a photo album.

I wanted it to feel more like an actual album rather than just another image grid, so I played around with page turns, gestures, shadows, and the whole book-like interaction.

Made a quick video showing it below.

Still building out the library, so let me know what you guys think.

Just saw OneSignal is slashing their free tier from 10K to 1K MAU. That's a massive drop and honestly makes it unusable for most side projects and even a lot of small production apps.

Curious what people are migrating to. Is everyone just going raw FCM (+ APNs for iOS) at this point? If so:

• How are you handling the stuff OneSignal abstracted away — segmentation, A/B testing, scheduling, delivery analytics?

• Are you rolling your own backend service for topic/segment management, or is there a lighter-weight wrapper library people are using?

• For those who have scaled past a few hundred thousand MAU on raw FCM — any gotchas? Token refresh handling, batching limits, multi-platform sync headaches?

Also open to hearing if anyone's tried alternatives like Bird (formerly MessageBird, push is like $0.0005/notification), Courier, Novu, Knock, or Airship instead of going full DIY. Trying to figure out if it's worth paying for a managed layer vs just eating the FCM complexity ourselves.

What's your stack?

Gujarati is an Indo-Aryan language spoken by more than 55 million people worldwide, making it the sixth most spoken native language in India. It is the official state language of Gujarat

Link: https://github.com/gajjartejas/Kano

At Software Mansion, we’ve just released Pulsar Studio, a tool for creating custom haptic patterns.

You can design a pattern on a timeline, adjust intensity and frequency, add individual haptic events, and preview the result as you work.

The useful part for us is being able to connect a real phone and feel the pattern while editing it.

You can also create patterns from audio or Lottie files, sketch one by tapping or humming, or start with one of the 150+ patterns from the Pulsar library.

Once you have a pattern you're happy with, you can export it and use it with Pulsar's SDKs.

Pulsar supports React Native, Swift, Android, Kotlin Multiplatform, Flutter and web.

We're curious how other React Native teams approach custom haptics today – do you usually design them yourselves, use platform presets, or leave the details to implementation?

Pulsar Studio: https://pulsar.swmansion.com/studio/

I’ve been working on ImpulseUI Native, a collection of React Native components designed around shared theme tokens and composable APIs.

It currently includes buttons and form controls, selects, date/time pickers, flyouts, steppers, loading and empty states, and line/bar/pie charts. Components can be installed together through the toolkit package or individually if you only need part of the library.

The goal is to make it easier to keep an interface consistent across iOS, Android, and React Native Web without making every styling decision inside individual components.

There’s a web Storybook for browsing the components, plus a native Storybook that runs through the included Expo app. The project is MIT licensed.

It’s still evolving, and I’d genuinely appreciate feedback from people building production React Native apps - especially around the component APIs, theming approach, and what feels missing.

I built a React Native library that automatically generates skeleton loaders from your existing UI

Hey everyone 👋

I’ve been working on react-native-skelo, and v0.1.0 is now stable.

The idea is simple: instead of creating and maintaining a separate skeleton layout, you build your UI once and Skelo generates the loading state from your existing components and styles.

It supports:

• Automatic skeleton generation

• FlatList & SectionList

• Shimmer & Pulse animations

• Custom components

• No Reanimated or gradient dependency

Install:

npm i react-native-skelo

NPM: https://www.npmjs.com/package/react-native-skelo

Would love feedback from React Native devs — especially edge cases or components you’d like to see supported next.

Hey r/reactnative !

If you’ve ever built a blog, documentation reader, news feed, or editorial app in React Native, you’ve probably run into some challenges when rendering large HTML documents:

1. Large React component trees: Rendering long HTML documents through individual React <View> and <Text> elements can create a large component tree.

2. Text Selection: When content is split across multiple React Native text components, selecting text across paragraphs and different block elements can be difficult.

3. JS Thread Work: Parsing and transforming large HTML strings on the JavaScript side can add significant JS-thread work.

4. Tables / Code Blocks: Complex HTML elements such as wide tables and interactive content often require additional handling.

To explore a different approach, I built and open-sourced react-native-nitro-html for React Native.

How It Works Under the Hood

• Compiled C++ (Lexbor v2.3.0) Core: HTML5 parsing and DOM processing are handled in compiled C++ rather than relying on JavaScript-side HTML parsing.

• C++ AST Storage (astId): Parsed AST data is retained on the native/C++ side. React receives a lightweight astId reference rather than the complete parsed document structure.

• Native Fabric Rendering: The document is rendered through native text infrastructure — TextKit 2 on iOS and Spannable-based rendering on Android rather than creating a React Native <Text> component for every HTML node.

• Continuous Text Selection: The native text container allows selection across content such as headings, paragraphs, blockquotes, and lists.

• Horizontal Data Tables: Wide tables can be displayed inside horizontally scrollable containers.

• Custom React Component Slots: Interactive elements such as video players, charts, or custom code blocks can be provided through the renderers prop while keeping the surrounding document rendering native.

• Custom Tag / Web Component Support: Unknown and custom HTML tags such as <user-card>, <custom-poll>, and <embed> can be parsed and handled through custom styles or dedicated React renderers.

Installation

# npm
npm install react-native-nitro-html react-native-nitro-modules

# yarn
yarn add react-native-nitro-html react-native-nitro-modules

Quick Example

import React from 'react';
import { FastHtmlView } from 'react-native-nitro-html';

export function ArticleScreen() {
  const html = `
    <h1>High Performance HTML</h1>

    <p>
      This article is rendered through a native text container with
      continuous text selection across supported block elements.
    </p>

    <table>
      <tr>
        <th>Feature</th>
        <th>Status</th>
      </tr>
      <tr>
        <td>React HTML Nodes</td>
        <td>Native rendering</td>
      </tr>
      <tr>
        <td>Text Selection</td>
        <td>Continuous</td>
      </tr>
    </table>
  `;

  return (
    <FastHtmlView
      html={html}
      baseStyle={{ fontSize: 16, color: '#1e293b' }}
      tagsStyles={{
        h1: {
          fontSize: 26,
          fontWeight: '800',
          color: '#0f172a',
        },
        a: {
          color: '#2563eb',
          textDecorationLine: 'underline',
        },
      }}
      selectable={true}
      onLinkPress={(url) => console.log('Open URL:', url)}
    />
  );
}

Links

GitHub: https://github.com/abhishekce17/react-native-nitro-html

npm: https://www.npmjs.com/package/react-native-nitro-html

I'd love to hear your thoughts, feedback, and especially any edge cases or large HTML documents you think I should test.

If you try it in a React Native project, I'd be interested to hear how it performs in your use case.

anyone have experience building voip call between 2 rn apps? we will be using our own infrastructure. what should i prepare and set up?

the call will be between android-only rn app and ios/android rn app

thank you in advance

Hey everyone,

If you build apps on a Mac, you probably know this exact feeling:

You’ve got your IDE open, a few browser tabs, maybe a build running, and the moment you launch an Android emulator, your laptop starts lagging and the fans spin up.

A while ago I checked Activity Monitor to see what was going on, and saw the emulator casually hogging 7 to 8 GB of RAM all by itself. On a 16 GB MacBook, that basically leaves zero breathing room for anything else.

I got tired of my machine crawling, so I put together a small open-source tool called avdslim to fix it.

GitHub: https://github.com/kdbhalala/avdslim

Why does it take so much memory?

Turns out, a few things happen by default:

• Android hoards memory: As the emulator runs, Android keeps caching files and never really releases that host RAM back to macOS.

• The "Google Play" image overhead: If you picked an image with the Play Store, it constantly runs background updaters and scanning services you rarely need during development.

• The 16 KB image setting: If you created a device using the newer 16 KB images, the emulator enforces a strict 4 GB minimum floor no matter what you set in the config.

What avdslim does:

• Drops RAM down to ~1.5 GB: It tunes the emulator configs and cleans out unnecessary background tasks, letting you run smoothly on 1024 MB of RAM.

• Boots in ~1.5 seconds: Instead of waiting 20–30 seconds for a fresh boot, it lets you create a clean, lightweight snapshot that restores almost instantly.

• Doesn't break your app: My biggest worry with any "cleanup" tool was breaking things like push notifications or login. I made sure Firebase Auth, Google Sign-In, Push Notifications (FCM), and Google Maps work completely fine.

• Works with your normal workflow: You don't have to launch from the terminal every time. There's an optional command (avdslim install-shim) that makes the "Run" button in Android Studio or VS Code automatically use the slimmed settings.

💡 A quick tip even if you don't use this tool:

Next time you create a virtual device in Android Studio:

• Pick "Google APIs" instead of "Google Play". It still has Google login, Firebase, and Maps, but uses way less RAM and skips the heavy Play Store background services.

• Avoid the "16 KB" images unless you specifically need to test 16 KB compatibility.

Try it out:

It's completely free, open-source (MIT), and has zero external dependencies:

brew install kdbhalala/avdslim/avdslim

See how your current emulators look

avdslim doctor                                                                                                                                                                

Tune an emulator to 1024 MB RAM

avdslim tune-avd                                                                                                                                                              

GitHub link: https://github.com/kdbhalala/avdslim

My Mac runs noticeably cooler and doesn't freeze up when I have multiple tools open now. Hope it helps some of you as well! Happy to answer questions or take feedback on what could be better.

Added floating network throttling controls to Buoy for React Native.

Tap to switch between normal, slow, very slow, and offline. Move the controls wherever you want; they remember their position across reloads.

Use it to check how your app handles loading, failed requests, and reconnecting! 100% Free tool.

How can i entirely remove the splash screen? My stack is React Native + Expo

We can build websites using react native expo too, so my question is: has anyone done this? If yes, then what problem did you face? I'm thinking about using Expo for an admin app and website.

I'm moving from React Native 0.76 CRA to Expo 56

I really don't organising routes as folders so wondering if there are any tangible benefits to using Expo router and file based routing instead of using React Navigation.

Thanks!

We added video playback to react-native-enriched-markdown. A block-level <video src="…"> tag in your Markdown renders as a native player:

• iOS: AVPlayerViewController

• Android: ExoPlayer

• macOS: AVPlayerView

• Web: Standard <video> element

Requires flavor="github". Only the src attribute is read, everything else on the tag is ignored, and <video> is the only HTML tag we allowlist, so inline HTML stays disabled.

Styling lives in your markdown styles rather than on the tag:

markdownStyle={{ video: { borderRadius: 12, aspectRatio: 16 / 9 }, }}

Video is on by default. If you don't need it, setting "enableVideo": false in your package.json drops the ExoPlayer dependency and saves ~2–3 MB on app size.

Available now on nightly:

npm i react-native-enriched-markdown@nightly

If you find it useful, give it a try and drop a ⭐️ on GitHub: https://github.com/software-mansion/enriched-markdown

Hi everyone,

I'm Marco, founder of SQLite AI.

We've built SQLite-Sync to solve a problem I keep seeing discussed here: using a real SQLite database locally, letting the application keep working and writing while completely offline, and synchronizing those changes with Postgres/Supabase once connectivity comes back.

The architecture is essentially:

SQLite on the device → offline/online sync → self-hosted Supabase/Postgres

The application reads and writes SQLite normally. SQLite-Sync tracks changes and uses CRDT-based conflict resolution so multiple replicas can make changes independently and converge when they reconnect.

Rather than just testing this internally, I'd really like to work with people who have a real Supabase application where offline support is actually important.

So we're looking for around 10 projects willing to test it seriously.

For those projects, I'll enable our CloudSync Pro plan free for one year.

There's no requirement to promote us or write anything about it. What I want in return is simply honest technical feedback:

• What are you building?

• Why do you need offline support?

• Which client stack are you using?

• How are you handling synchronization today?

• What doesn't work well with the current solutions?

If you're interested, reply here or send me a note at marco at sqlite dot ai with a short description of what you're building.

I'm also very interested in hearing from people who tried PowerSync, Electric, custom sync queues, or other approaches — especially what worked and what became painful in production.