flutter_web_struct 0.0.2 copy "flutter_web_struct: ^0.0.2" to clipboard
flutter_web_struct: ^0.0.2 copied to clipboard

This package simplifies the creation of web applications taking into account responsiveness and much more.

flutter_web_struct #

Package for help developper to make a nice website!

Installation #

Add flutter_web_struct as a dependency in your pubspec.yaml file.

dependencies:
flutter_web_struct: ^0.0.2

Usage #

For use flutter_web_struct by following steps :

// Import the plugin
import 'package:flutter_web_struct/flutter_web_struct.dart';

// call initialisation in main 
void main() async {
  runApp(const MyApp());
} 

Call WebStructController and configure your Design

class MyApp extends StatelessWidget {
  MyApp({Key? key}) : super(key: key);
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
   
    var ctrl = WebStructController();
    //Configure Base Url if you need
    ctrl.webStructUrlBase = "http://www.mywebsite.com";

    // this is header
    ctrl.header = Container(
      color: Colors.red,
      height: 48,
      child: const Center(
        child: Text("This is header"),
      ),
    );
 // this is footer
    ctrl.footer = Container(
      color: Colors.white,
      height: 24,
      child: const Center(
        child: Text(
          "This is footer",
        ),
      ),
    );
    
    //you can manage your MaterialApp as you want, with your RouteManager

    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        // is not restarted.
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage('Flutter Demo Home Page'),
    );
  }
}

Create your page extends WebPage


class MyHomePage extends WebPage {
// Choose FULLCONTENT or SCROLLVIEW (defaut ScrollView)
  MyHomePage(title) : super(title, typePage: TypePage.FULLCONTENT);

//Complet your design for Large screen
  @override
  Widget largeContent(BuildContext context) {
    return Container(
      color: Colors.blue,
      child: const Center(
        child: Text(
          "Large content",
        ),
      ),
    );
  }

//Complet your design for Small screen

  @override
  Widget smallContent(BuildContext context) {
    return Container(
      color: Colors.green,
      child: const Center(
        child: Text(
          "Small content",
        ),
      ),
    );
  }

//Complet your design for Medium screen
  @override
  Widget mediumContent(BuildContext context) {
    return Container(
      color: Colors.purple,
      child: const Center(
        child: Text(
          "Medium content",
        ),
      ),
    );
  }
}

Or Create your page extends MobilePage



class MyMobilePage extends MobilePage{
  MyMobilePage(String title) : super(title,typePage: TypePage.FULLCONTENT,typeMenu: TypeMenu.DRAWER);

  @override
  Widget largeContent(BuildContext context) {
    return  Container(
      color: Colors.blue,
      child: const Center(
        child: Text(
          "Large & medium content",
        ),
      ),
    );
  }

  @override
  Widget smallContent(BuildContext context) {
    return  Container(
      color: Colors.blue,
      child: const Center(
        child: Text(
          "Small content",
        ),
      ),
    );
  }
}

Configure your screen

    ctrl.webStructLargePage = 1200; //default value
    ctrl.webStructMediumPage = 800; //default value
2
likes
130
points
38
downloads

Publisher

verified publishersidgey.fr

Weekly Downloads

This package simplifies the creation of web applications taking into account responsiveness and much more.

Repository (GitHub)

Documentation

API reference

License

Unlicense (license)

Dependencies

flemme, flutter, flutter_web_plugins

More

Packages that depend on flutter_web_struct