Matthieu G.
@matthieugc.bsky.social
Building mobile apps with React Native.
Mistral AI / Le Chat
Mistral AI / Le Chat
Has anyone found a clean way to vertically center a View inside a multiline text in React Native (with the new arch)?
An arbitrary `translateY` moves the tag, but it's very manual and not robust to font scaling 😬
An arbitrary `translateY` moves the tag, but it's very manual and not robust to font scaling 😬
December 6, 2024 at 2:57 PM
Has anyone found a clean way to vertically center a View inside a multiline text in React Native (with the new arch)?
An arbitrary `translateY` moves the tag, but it's very manual and not robust to font scaling 😬
An arbitrary `translateY` moves the tag, but it's very manual and not robust to font scaling 😬
Here's an example I found in the codebase I'm working on. How would you migrate it? 🤔
Of course there are other ways to do icons, but it's a legit approach...
(I simplified the code, there are other props like `size` in the real version)
Of course there are other ways to do icons, but it's a legit approach...
(I simplified the code, there are other props like `size` in the real version)
![Code screenshot
import { Image } from "expo-image";
import { useStyles } from "react-native-unistyles";
import { icons } from "#assets/icons";
import type { Theme } from "#shared/theme/theme";
type IconName = keyof typeof icons;
type Props = {
name: IconName;
color: keyof Theme["colors"]; // There are 230 colors in the theme
};
export const Icon = ({ name, color }: Props) => {
const { theme } = useStyles();
return <Image source={icons[name]} tintColor={theme.colors[color]} />;
};](https://cdn.bsky.app/img/feed_thumbnail/plain/did:plc:h5ygia2yhgmvm6fjroyizp4u/bafkreiaqpjanj62t5bnbb7t46g5x7wnwitoc5z7wgrvzglaylr7a7cb7km@jpeg)
November 29, 2024 at 6:51 PM
Here's an example I found in the codebase I'm working on. How would you migrate it? 🤔
Of course there are other ways to do icons, but it's a legit approach...
(I simplified the code, there are other props like `size` in the real version)
Of course there are other ways to do icons, but it's a legit approach...
(I simplified the code, there are other props like `size` in the real version)