[flutter] 화면 방향 고정시키기

화면을 세로 또는 가로로 고정시키는 방법을 알아봅니다.

 

1. import 'package:flutter/services.dart'; 를 입력해줍니다.

 

2. StatelessWidget class  build() 메서드 안에다가 SystemChrome.setPreferredOrientations([DeviceOrientation.landscapeLeft]); 이런식으로 넣어줍니다.

 

3. 실행합니다.

 

끝!

 

setPreferredOrientations 는 배열 형태로 파라미터 입력을 받습니다. 가로모드만 넣으면 가로방향만 보이게 되고 세로 방향까지 넣으면 세로 방향으로도 전환되게 할 수 있습니다.

 

그럼 실제 사용 코드를 확인해보겠습니다.

 

< 세로방향 >

1. 한쪽으로만 고정시킬 경우

import 'package:flutter/services.dart';
import 'package:flutter/material.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    // 세로 위쪽 방향 고정
    SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp]);
 
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}
 

2. 세로 위아래로 고정시킬 경우

import 'package:flutter/services.dart';
import 'package:flutter/material.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    // 세로 위아래 방향 고정
    SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp, DeviceOrientation.portraitDown]);
 
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

 

 

< 가로방향 >

1. 한쪽으로만 고정시킬 경우

import 'package:flutter/services.dart';
import 'package:flutter/material.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    // 가로 왼쪽 방향 고정
    SystemChrome.setPreferredOrientations([DeviceOrientation.landscapeLeft]);
 
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

2. 가로 좌우로 고정시킬 경우

import 'package:flutter/services.dart';
import 'package:flutter/material.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    // 가로 왼쪽, 오른쪽 방향 고정
    SystemChrome.setPreferredOrientations([DeviceOrientation.landscapeLeft, DeviceOrientation.landscapeRight]);
 
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

이상 플러터에서 화면을 고정시키는 방법에 대해서 알아보았습니다.