Search packages, repositories and app categories

GitHub repositorywisnuwiry/flutter_web_frame

flutter_web_frame

Make Limit content size in Flutter Web/Desktop/PWA, Make your app that doesn't support responsiveness more focused on content. Demo: https://flutter-web-frame.vercel.app

flutter_web_frame project cover
Stars
16
Forks
10
Last push (UTC)
Jul 6, 2023
Project status
Active

Original README

English project snapshot. Visit GitHub for the latest content.

Flutter Web Frame

Pub

Make the frame max width / size when on large devices such as Web or Desktop.

This is very suitable to be used to limit the size of content, if your application is not yet available a responsive version if it is run on multiple devices / platforms.

Preview

Preview

Install

Follow the instructions to install it here

Example Usage

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_web_frame/flutter_web_frame.dart';

void main() {
  runApp(MyAp());
}

class MyAp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return FlutterWebFrame(
      builder: (context) {
        return MaterialApp(
          home: Scaffold(
            appBar: AppBar(
              title: Text('Flutter Web Frame'),
            ),
            body: Center(
              child: Text('Body Text'),
            ),
          ),
        );
      },
      maximumSize: Size(475.0, 812.0), // Maximum size
      enabled: kIsWeb, // default is enable, when disable content is full size
      backgroundColor: Colors.grey, // Background color/white space
    );
  }
}
Wisnu G Saputra GitHub avatar
GitHub author

Wisnu G Saputra ↗

Product Engineer

@zero-one-groupJepara, IndonesiaOfficial website ↗
LanguagesDartHTML

Categories

Packages published by this repository

Dependencies used

Dependency list 3 items

  • flutter{"sdk":"flutter"}
  • flutter_testDevelopment{"sdk":"flutter"}
  • pedanticDevelopment^1.11.1

How do I choose a repository?

Start with your use case, compare repository activity, and check the original project before adopting it.

  1. Search by repository name, owner or description, then narrow the results by topic.
  2. Compare stars, forks and recent pushes. Stars show community interest, not a guarantee of quality.
  3. Read the README, license and issues on GitHub before using a project.

Sources and maintenance

“A repository is the most basic element of GitHub.”

GitHub Docs — About repositories ↗