[GH-ISSUE #6] stretchy={false} not working

gitea-mirror commented

2026-05-05 11:22:07 -06:00

Owner

Originally created by @Boomxx on GitHub (Feb 16, 2018).
Original GitHub issue: https://github.com/kusti8/proton-native/issues/6

The universal prop stretchy doesn't seem to be working for me with the following versions:

  "dependencies": {
    "proton-native": "^1.0.9",
    "react": "^16.2.0"
  },

TextInput, Button, Box for example always fill the available space regardless of adding stretchy={false}.

I also was unable to find out how to position and size components - is that somewhere in the docs that I missed?

Originally created by @Boomxx on GitHub (Feb 16, 2018). Original GitHub issue: https://github.com/kusti8/proton-native/issues/6 The universal prop `stretchy` doesn't seem to be working for me with the following versions: ``` "dependencies": { "proton-native": "^1.0.9", "react": "^16.2.0" }, ``` `TextInput, Button, Box` for example always fill the available space regardless of adding `stretchy={false}`. I also was unable to find out how to position and size components - is that somewhere in the docs that I missed?

gitea-mirror closed this issue

2026-05-05 11:22:11 -06:00

gitea-mirror commented

2026-05-05 11:22:13 -06:00

Author

Owner

@kusti8 commented on GitHub (Feb 16, 2018):

Can you paste your code?

On Thu, Feb 15, 2018, 7:21 PM Boomxx notifications@github.com wrote:

The universal prop stretchy doesn't seem to be working for me with the
following versions:

"dependencies": {
"proton-native": "^1.0.9",
"react": "^16.2.0"
},

TextInput, Button, Box for example always fill the available space
regardless of adding stretchy={false}.

I also was unable to find out how to position and size components - is
that somewhere in the docs that I missed?

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
https://github.com/kusti8/proton-native/issues/6, or mute the thread
https://github.com/notifications/unsubscribe-auth/AJW73FWrU12sWtCYLMqRzPv9CKjjKnnkks5tVMoKgaJpZM4SHtwC
.

@kusti8 commented on GitHub (Feb 16, 2018): Can you paste your code? On Thu, Feb 15, 2018, 7:21 PM Boomxx <notifications@github.com> wrote: > The universal prop stretchy doesn't seem to be working for me with the > following versions: > > "dependencies": { > "proton-native": "^1.0.9", > "react": "^16.2.0" > }, > > TextInput, Button, Box for example always fill the available space > regardless of adding stretchy={false}. > > I also was unable to find out how to position and size components - is > that somewhere in the docs that I missed? > > — > You are receiving this because you are subscribed to this thread. > Reply to this email directly, view it on GitHub > <https://github.com/kusti8/proton-native/issues/6>, or mute the thread > <https://github.com/notifications/unsubscribe-auth/AJW73FWrU12sWtCYLMqRzPv9CKjjKnnkks5tVMoKgaJpZM4SHtwC> > . >

gitea-mirror commented

2026-05-05 11:22:14 -06:00

Author

Owner

@Boomxx commented on GitHub (Feb 16, 2018):

Sure, I have just been trying the examples out and seeing the issue:

import React, { Component } from 'react';

import { render, Window, App, TextInput, Dialog } from 'proton-native';

class Example extends Component {
  render() {
    return (
      <App>
        <Window title="Example" height={500} width={500}>
          <TextInput
            stretchy={false}
            onChanged={() => Dialog('Error', { title: 'Message' })}
          />
        </Window>
      </App>
    );
  }
}

render(<Example />);

@Boomxx commented on GitHub (Feb 16, 2018): Sure, I have just been trying the examples out and seeing the issue: ``` import React, { Component } from 'react'; import { render, Window, App, TextInput, Dialog } from 'proton-native'; class Example extends Component { render() { return ( <App> <Window title="Example" height={500} width={500}> <TextInput stretchy={false} onChanged={() => Dialog('Error', { title: 'Message' })} /> </Window> </App> ); } } render(<Example />); ```

gitea-mirror commented

2026-05-05 11:22:15 -06:00

Author

Owner

@kusti8 commented on GitHub (Feb 16, 2018):

When you only have a single child in a window, then you can't use stretchy.
You need to have a box in the window, and then the text input inside the
box. Was this in my documentation ? If so could you link it so I can fix it?

On Thu, Feb 15, 2018, 7:25 PM Boomxx notifications@github.com wrote:

Sure, I have just been trying the examples out and seeing the issue:

import React, { Component } from 'react';

import { render, Window, App, TextInput, Dialog } from 'proton-native';

class Example extends Component {
render() {
return (

<TextInput
stretchy={false}
onChanged={() => Dialog('Error', { title: 'Message' })}
/>

);
}
}

render();

—
You are receiving this because you commented.

Reply to this email directly, view it on GitHub
https://github.com/kusti8/proton-native/issues/6#issuecomment-366107935,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AJW73G1noo9JAdfI9AuGb3WAr60HOv99ks5tVMsDgaJpZM4SHtwC
.

@kusti8 commented on GitHub (Feb 16, 2018): When you only have a single child in a window, then you can't use stretchy. You need to have a box in the window, and then the text input inside the box. Was this in my documentation ? If so could you link it so I can fix it? On Thu, Feb 15, 2018, 7:25 PM Boomxx <notifications@github.com> wrote: > Sure, I have just been trying the examples out and seeing the issue: > > import React, { Component } from 'react'; > > import { render, Window, App, TextInput, Dialog } from 'proton-native'; > > class Example extends Component { > render() { > return ( > <App> > <Window title="Example" height={500} width={500}> > <TextInput > stretchy={false} > onChanged={() => Dialog('Error', { title: 'Message' })} > /> > </Window> > </App> > ); > } > } > > render(<Example />); > > — > You are receiving this because you commented. > > > Reply to this email directly, view it on GitHub > <https://github.com/kusti8/proton-native/issues/6#issuecomment-366107935>, > or mute the thread > <https://github.com/notifications/unsubscribe-auth/AJW73G1noo9JAdfI9AuGb3WAr60HOv99ks5tVMsDgaJpZM4SHtwC> > . >

gitea-mirror commented

2026-05-05 11:22:17 -06:00

Author

Owner

@Boomxx commented on GitHub (Feb 16, 2018):

https://proton-native.js.org/#/methods/dialog

@Boomxx commented on GitHub (Feb 16, 2018): https://proton-native.js.org/#/methods/dialog

gitea-mirror commented

2026-05-05 11:22:18 -06:00

Author

Owner

@kusti8 commented on GitHub (Feb 16, 2018):

Ok thank you I'll fix that now.

On Thu, Feb 15, 2018, 7:31 PM Boomxx notifications@github.com wrote:

https://proton-native.js.org/#/methods/dialog

—
You are receiving this because you commented.

Reply to this email directly, view it on GitHub
https://github.com/kusti8/proton-native/issues/6#issuecomment-366109009,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AJW73FcGIo07QbcDoJHHr396Y88BVgraks5tVMx1gaJpZM4SHtwC
.

@kusti8 commented on GitHub (Feb 16, 2018): Ok thank you I'll fix that now. On Thu, Feb 15, 2018, 7:31 PM Boomxx <notifications@github.com> wrote: > https://proton-native.js.org/#/methods/dialog > > — > You are receiving this because you commented. > > > Reply to this email directly, view it on GitHub > <https://github.com/kusti8/proton-native/issues/6#issuecomment-366109009>, > or mute the thread > <https://github.com/notifications/unsubscribe-auth/AJW73FcGIo07QbcDoJHHr396Y88BVgraks5tVMx1gaJpZM4SHtwC> > . >

gitea-mirror commented

2026-05-05 11:22:20 -06:00

Author

Owner

@Boomxx commented on GitHub (Feb 16, 2018):

Is this the expected result with stretchy={false}?

import React, { Component } from 'react';

import {
  render,
  Window,
  App,
  TextInput,
  Dialog,
  Button,
  Box,
} from 'proton-native';

class Example extends Component {
  render() {
    return (
      <App>
        <Window title="Example" height={500} width={500}>
          <Box>
            <Button stretchy={false}>Button</Button>
            <TextInput
              stretchy={false}
              onChanged={() => Dialog('Error', { title: 'Message' })}
            />
          </Box>
        </Window>
      </App>
    );
  }
}

render(<Example />);

@Boomxx commented on GitHub (Feb 16, 2018): ![image](https://user-images.githubusercontent.com/13614959/36288103-12e11410-1287-11e8-995a-fb3a46ec06bd.png) Is this the expected result with `stretchy={false`}? ``` import React, { Component } from 'react'; import { render, Window, App, TextInput, Dialog, Button, Box, } from 'proton-native'; class Example extends Component { render() { return ( <App> <Window title="Example" height={500} width={500}> <Box> <Button stretchy={false}>Button</Button> <TextInput stretchy={false} onChanged={() => Dialog('Error', { title: 'Message' })} /> </Box> </Window> </App> ); } } render(<Example />); ```

gitea-mirror commented

2026-05-05 11:22:21 -06:00

Author

Owner

@kusti8 commented on GitHub (Feb 16, 2018):

Yes it is. You can't set the size of the objects unfortunately, that's just
how libui is. You can add separators or make it all a grid if you want.

On Thu, Feb 15, 2018, 7:34 PM Boomxx notifications@github.com wrote:

[image: image]
https://user-images.githubusercontent.com/13614959/36288103-12e11410-1287-11e8-995a-fb3a46ec06bd.png

Is this the expected result with stretchy={false}?

import React, { Component } from 'react';

import {
render,
Window,
App,
TextInput,
Dialog,
Button,
Box,
} from 'proton-native';

class Example extends Component {
render() {
return (

<TextInput
stretchy={false}
onChanged={() => Dialog('Error', { title: 'Message' })}
/>

);
}
}

render();

—
You are receiving this because you modified the open/close state.

Reply to this email directly, view it on GitHub
https://github.com/kusti8/proton-native/issues/6#issuecomment-366109370,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AJW73N3geSo1xkpi1DFr5USAgXGoeoUCks5tVMz5gaJpZM4SHtwC
.

@kusti8 commented on GitHub (Feb 16, 2018): Yes it is. You can't set the size of the objects unfortunately, that's just how libui is. You can add separators or make it all a grid if you want. On Thu, Feb 15, 2018, 7:34 PM Boomxx <notifications@github.com> wrote: > [image: image] > <https://user-images.githubusercontent.com/13614959/36288103-12e11410-1287-11e8-995a-fb3a46ec06bd.png> > > Is this the expected result with stretchy={false}? > > import React, { Component } from 'react'; > > import { > render, > Window, > App, > TextInput, > Dialog, > Button, > Box, > } from 'proton-native'; > > class Example extends Component { > render() { > return ( > <App> > <Window title="Example" height={500} width={500}> > <Box> > <Button stretchy={false}>Button</Button> > <TextInput > stretchy={false} > onChanged={() => Dialog('Error', { title: 'Message' })} > /> > </Box> > </Window> > </App> > ); > } > } > > render(<Example />); > > > — > You are receiving this because you modified the open/close state. > > > Reply to this email directly, view it on GitHub > <https://github.com/kusti8/proton-native/issues/6#issuecomment-366109370>, > or mute the thread > <https://github.com/notifications/unsubscribe-auth/AJW73N3geSo1xkpi1DFr5USAgXGoeoUCks5tVMz5gaJpZM4SHtwC> > . >

gitea-mirror commented

2026-05-05 11:22:24 -06:00

Author

Owner

@Boomxx commented on GitHub (Feb 16, 2018):

okay great thanks - just wanted to make sure I wasn't messing anything up

@Boomxx commented on GitHub (Feb 16, 2018): okay great thanks - just wanted to make sure I wasn't messing anything up

gitea-mirror referenced this issue

2026-05-05 11:56:00 -06:00

[PR #3] [MERGED] Change title of color_button.md #221

Rows
Columns

[GH-ISSUE #6] stretchy={false} not working #3