Flutter95

Windows95 UI components for Flutter apps.

Screenshots

Screenshot

Components

Scaffold95

Scaffold as a Windows95 styled window.

  • Provides title.
  • Optional: toolbar that requires Item95 action items.
Screenshot
  • If a scaffold canPop (meaning it is not a root of the app) then a close button appears.
Screenshot
Scaffold95(
  title: 'Flutter95',
  toolbar: Toolbar95(
    actions: [
      Item95(
        label: 'File', 
        onTap: () {},
      ),
    ],
  ),
  body: Container(),
)

Windows95 styled menu.

Screenshot
  • Easy API wrapping Material's showMenu.
Menu95(
  items: [
    MenuItem95(
      value: 1,
      label: 'New',
    ),
    MenuItem95(
      value: 2,
      label: 'Open',
    ),
    MenuItem95(
      value: 3,
      label: 'Exit',
    ),
  ],
  onItemSelected: (item) {},
);
  • Display using show(context, position).
menu.show(
  context,
  Offset(50, 100),
);
  • Use it directly with Item95 to be positioned automatically.
Item95(
  label: 'File',
  menu: Menu95(...),
),

Button95

Windows95 styled button.

  • Provides default text style for child widgets.
  • Provides default padding for children.
  • If onTap is null, acts as a disabled button.
Button95(
  onTap: () {},
  child: Text('Button95'),
)

Checkbox95

Windows95 styled checkbox

  • Provides label in windows95 style.
  • If onChanged is null, acts as a disabled checkbox.
Checkbox95(
    value: value,
    label: "Some Label", // optional, if null no label is shown
    onChanged: (value) {}, // optional, if null acts as a disabled checkbox
)
Checkbox95

TextField95

TextField styled as a Windows95 text field.

  • Uses a Material TextField internally.
TextField95()

Tooltip95

A tooltip widget designed in Windows95 style.

  • Works just like Material's Tooltip.
Tooltip95(
    message: 'Hello from Flutter95!',
    child: Text('I have a tooltip for you!'),
)
Tooltip95

Divider95

A divider widget designed in Windows95 style.

  • Works just like Material's Divider.
  • Supports indent, endIndent and height.
Divider95()
Divider95

Elevation95

Creates an effect of deepness and elevation around Widgets.

Elevation95(
  child: Text('Elevated Text')
)

Flutter95.textStyle

TextStyle ready to use that copies the Windows95 text style.

Text(
  'Text with Flutter95.textStyle',
  style: Flutter95.textStyle,
);

Dialogs

showDialog95(
  context: context,
  title: 'Error',
  message: 'Task failed successfully',
);
Dialog

Contributing

You can contribute in different ways:

  • Creating new Windows95 styled components.
    • Please include screenshots in your PRs!
    • Please update the example and tests to include the new component!
  • Improving existing components with better options.
  • Improving documentation both in code and this README file.
  • Creating more tests.
  • Improving CI scripts.
  • Fixing lint issues.
  • Creating feature requests.
    • Please include a screenshot.
    • Also don't expect a quick response, this is a hobby project.
  • Reporting bugs.

Acknowledgments

Heavily inspired by React95.

Featured in My Windows 95 ChatGPT app by @filiph.

Libraries

flutter95