Giter VIP home page Giter VIP logo

Comments (4)

MichaelCereda avatar MichaelCereda commented on August 10, 2024

The fields have version for android and a version for ios just for styling purposes but the underlying component is unified.

from react-native-form-generator.

ramsestom avatar ramsestom commented on August 10, 2024

Well it would make more sense to have the same default styling between both ios and android (and to provide android or ios specific styling in a platform conditional stylesheet that can be passed to the 'style' tag of the component if someone really wants to have a different style on the two platforms).
Because here the problem is that the default styling is inconsistent between the two platforms. So if you extend the default styling (by passing a new style to the style tag of your component), your component would inherit different parent style depending on which platform you are on...

Basically, what I propose is to have a default style that is exactly the same on android and ios (when possible) and then, you can also provide in the lib a platform dependent stylesheet for each component if you want. Like:

import { Platform, StyleSheet } from 'react-native';

const platform_styles = StyleSheet.create({
  inputfield : {
    flex: 1,
    ...Platform.select({
      ios: {
        backgroundColor: 'red',
      },
      android: {
        backgroundColor: 'blue',
      },
    }),
  },
}); 

and a user can choose or not to apply this platform specific style to a form component like:

<InputField style={platform_styles.inputfield} ... />

Or

<InputField style={[platform_styles.inputfield, mystyle.inputfield]} ... />

if he wants to extend/override the default platform specific style

And if he don't want a platform specific style, he could just do:

<InputField style={mystyle.inputfield} ... />

to extend/override the common default style

from react-native-form-generator.

MichaelCereda avatar MichaelCereda commented on August 10, 2024

That's right, I'm also thinking to implement the same style for both.
The problem is that android and ios have a different style and unless
you're making a sort of game (and I would suggest to create custom
components for that) having the same style will easily make your form look
different from the whole ecosystem.

I'm about to submit another update that will fix the android
inconsistencies and will also expose the components to allow a complete
customization of the fields.

On Tue, Aug 23, 2016, 5:22 PM ramsestom [email protected] wrote:

Well it would make more sense to have the same default styling between
both ios and android (and to provide android or ios specific styling in a
platform conditional stylesheet that can be passed to the 'style' tag of
the component if someone really wants to have a different style on the two
platforms).
Because here the problem is that the default styling is inconsistent
between the two platforms. So if you extend the default styling (by passing
a new style to the style tag of your component), your component would
inherit different parent style depending on which platform you are on...


You are receiving this because you commented.

Reply to this email directly, view it on GitHub
#54 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAGjfk76VtCezAvBvNxAufXq51PiuSpKks5qi2SlgaJpZM4JrTDo
.

Michael Cereda
http://michaelcereda.com

from react-native-form-generator.

ramsestom avatar ramsestom commented on August 10, 2024

The problem is that android and ios have a different style and unless
you're making a sort of game (and I would suggest to create custom
components for that) having the same style will easily make your form look
different from the whole ecosystem.

I think you should just propose ios or android styles as themes (with stylesheets), that the user can choose or not to apply to the component, and keep the default styling identical between both platforms.
Having a platform specific theme as stylesheets doesn't prevent from customizing these styles by overriding them when needed. And, at least, the user can choose or not to apply platform dependent styling and you won't have anymore inconsistencies when overriding the default styling....

What I would do:

  • a default styling common to all platforms and directly embedded into the component class
  • a styleesheet for components on ios, that match the ios ecosystem style
  • a styleesheet for components on android, that match the android ecosystem style
  • a platform_style stylesheet that simply call the ios or android stylesheet, depending on the platform you are one

This way, you can stick with the default common styling or have a platform specific one by simply applying the platform_style stylesheet to you component (then, on both case, you can extend/override this style to have your really personal style for your app)

from react-native-form-generator.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.