1,强制横屏

OrientationBuilder小部件以及SystemChrome类来实现根据设备类型进行强制横屏

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

void main() => runApp(MyApp1());

class MyApp1 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Force Landscape',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Force Landscape'),
        ),
        body: OrientationBuilder(
          builder: (context, orientation) {
            SystemChrome.setPreferredOrientations([
              DeviceOrientation.landscapeLeft,
              DeviceOrientation.landscapeRight,
            ]); // 强制横屏

            return orientation == Orientation.portrait
                ? buildPortraitLayout()
                : buildLandscapeLayout();
          },
        ),
      ),
    );
  }

  Widget buildPortraitLayout() {
    return const Center(
      child: Text(
        'Please rotate your device to landscape orientation.',
        style: TextStyle(fontSize: 20.0),
      ),
    );
  }

  Widget buildLandscapeLayout() {
    return Column(
      mainAxisAlignment: MainAxisAlignment.end,
      children: [
        const Expanded(
          child: Center(
            child: Text(
              'This is the main content.',
              style: TextStyle(fontSize: 20.0),
            ),
          ),
        ),
        Container(
          color: Colors.blue,
          padding: EdgeInsets.all(16.0),
          child: const Text(
            'Bottom Bar',
            style: TextStyle(color: Colors.white, fontSize: 16.0),
          ),
        ),
      ],
    );
  }
}

 2.

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // 强制横屏
    SystemChrome.setPreferredOrientations([
      DeviceOrientation.landscapeLeft,
      DeviceOrientation.landscapeRight,
    ]);

    return MaterialApp(
      title: 'Flutter横屏示例',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // 获取屏幕宽度和高度
    var screenWidth = MediaQuery.of(context).size.width;
    var screenHeight = MediaQuery.of(context).size.height;

    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter横屏示例'),
      ),
      body: Container(
        padding: EdgeInsets.all(10),
        // 根据屏幕宽度手动计算并适配UI布局
        width: screenWidth,
        height: screenHeight,
        child: Center(
          child: Text(
            '这是一个横屏示例',
            style: TextStyle(fontSize: screenWidth * 0.05),
          ),
        ),
      ),
    );
  }
}

监听屏幕的方向 

import 'package:flutter/material.dart';

class MyKey extends StatelessWidget {
  const MyKey({super.key});

  @override
  Widget build(BuildContext context) {
        print(MediaQuery.of(context).orientation); //监听屏幕方向(横竖)
    return MyApp();
  }
}

 

posted on 2023-12-19 14:26  鲤斌  阅读(69)  评论(0编辑  收藏  举报