responsive-native icon indicating copy to clipboard operation
responsive-native copied to clipboard

[Feature request] Responsive style sheet

Open italomlp opened this issue 4 years ago • 4 comments

Hello guys! First of all, awesome lib @diego3g. I think it will be very helpful for us all!

One thing that can be a great addon is a ResponsiveStyleSheet (or ResponsiveSheet, if you prefer) that acts like the default rn's Stylesheet plus a parser to rem flags. It's something like the ScaledSheet from react-native-size-matters. It could be nice for the ones that often use the default Stylesheet instead of styled-components. So, for example, we can have something like:

import { ResponsiveStyleSheet } from 'react-native-size-matters';

const styles = ResponsiveStyleSheet.create({
  container: {
    width: '100rem',
    height: '200rem',
    padding: '2rem',
    margin: 5
  },
  row: {
    padding: '10rem',
    width: '50rem',
    height: '30rem'
  }
});

What do you think about it?

italomlp avatar Jun 29 '21 20:06 italomlp

That would be great, but i think we should not replace StyleSheet from React Native but maybe we should make it work as a extension like:

import { StyleSheet } from 'react-native';
import { makeResponsive } from 'responsive-native';

const styles = makeResponsive(
  StyleSheet.create({
    container: {
      width: '100rem',
      height: '200rem',
      padding: '2rem',
      margin: 5
    },
    row: {
      padding: '10rem',
      width: '50rem',
      height: '30rem'
    }
  })
);

I don't know the better API for that for now, but I'll think a little bit more about it.

diego3g avatar Jun 29 '21 20:06 diego3g

@diego3g nice man! Makes sense. Let me know if I can support you with ideas or the implementation part. I would be happy to help.

italomlp avatar Jun 29 '21 20:06 italomlp

I'm working on this (dd80a35b17098f8e1a98e08efce1a2946ee3c5e3)

diego3g avatar Jun 30 '21 03:06 diego3g

Hey guys, all right? How is the implementation of this feature going? It would be very important for the project I'm working on. Help us @diego3g <3

juniorogaa avatar Jun 09 '22 17:06 juniorogaa