Skip to content

Dialog & all its inherited widget added #344

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Mar 26, 2021
Merged

Conversation

KRTirtho
Copy link
Contributor

Fixes #108
Added Components:

  • Dialog
  • ColorDialog
  • FileDialog
  • FontDialog
  • InputDialog
  • ProgressDialog

Edited/Modified:

  • View (both were edited to add compatibility & support for all NodeDialog inherited widgets)
  • BoxView

Disclaimer!: Dialog & its all inherited widgets can only be used inside a View or BoxView. Using it in other places will not work. It'd cause the Dialog components to not appear. This behavior was expected since adding NodeDialog inherited widgets to Layout or as a child to other widgets doesn't work. Thus filters were added to View & BoxView to not let any instance of NodeDialog to be added in the layout tree

An working example:

import React, {useState} from "react";
import { Text, Renderer, Window, View, Button, Dialog } from "@nodegui/react-nodegui";

const App = () => {
  const [open, setOpen] = useState(false);

  return (
    <Window styleSheet={styleSheet}>
      <View id="container">
        <Dialog open={open}/>
        <Button text="Click me" on={{clicked:()=>setOpen(!open)}}></Button>
      </View>
    </Window>
  );
};

const styleSheet = `
  #container {
    flex: 1;
    min-height: '100%';
    justify-content: 'center';
  }
`;

Renderer.render(<App />);

Thanks @a7ul

- FileDialog
- InputDialog
- ProgressDialog
Edited:
- demo file for testing the dialogs
- ColorDialog
- FontDialog
Edited:
- Dialog (for adding some props)
@a7ul
Copy link
Collaborator

a7ul commented Mar 26, 2021

Amazing work!!!

Dialog & its all inherited widgets can only be used inside a View or BoxView. Using it in other places will not work. It'd cause the Dialog components to not appear. 

Can you add a warning log here saying child wasnt rendered because it was used not inside a view or boxview when this happens ?

@KRTirtho
Copy link
Contributor Author

Currently I don't know any way of accessing parent Component/Widget in react thus determining whether any component was added as a child to a certain type of Component/s isn't possible in that view. But if there's any method/property of QDialog that can get the instance of parent widget or anything about parent widget please let me know...

@a7ul
Copy link
Collaborator

a7ul commented Mar 26, 2021

You can take a look at this: https://github.com/nodegui/react-nodegui/blob/master/src/components/TabItem/RNTabItem.ts

But If its too complex for this use case we can go ahead with too.

@KRTirtho
Copy link
Contributor Author

KRTirtho commented Mar 26, 2021

Well, I looked into that example.. But I've to extend QDialog to inherit the functionalities but looks like TabItem isn't a nodegui/qt widget. It is a vanilla widget & was fundamentally created for react-nodegui's Tabs so inheriting Component was possible.
If you really want to show a warning log about adding a NodeDialog instance to the layout tree than you can do so in nodegui's widget.layout.addWidget, widget.setWidget or widget.setCentralWidget. It'd even make it better for the nodegui's part too preventing accidental addition of Dialog as child

Looks like it'd be complicated for the react-nodegui part. So I suggest about going ahead
Thanks again @a7ul

@a7ul a7ul merged commit fbd6a53 into nodegui:master Mar 26, 2021
@a7ul
Copy link
Collaborator

a7ul commented Mar 26, 2021

@all-contributors add @KRTirtho for code

@allcontributors
Copy link
Contributor

@a7ul

I've put up a pull request to add @KRTirtho! 🎉

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Nested window support (Modals or Dialogs)
2 participants