Partager via


Angle de charnière sur Flutter

La charnière du Surface Duo et des autres appareils pliables contient un capteur qui nous indique l'angle entre les deux écrans. La valeur de l’angle de charnière est comprise entre 0 et 360 :

  • 0 - Les écrans sont face aux autres et ne sont pas visibles. L’appareil est fermé.
  • 90 - L’appareil est une forme « L » avec les écrans à l’intérieur, parfois appelé ordinateur portable, table ou mode livre.
  • 180 - L’appareil est plat. Les écrans sont orientés dans la même direction.
  • 360 - Les écrans font face à des directions opposées et un seul écran fonctionne.

Position de l’appareil et angle de charnière

L’angle de charnière est déjà utilisé pour calculer la position de l’appareil. La posture de l’appareil est déjà exposée via MediaQuery , mais il existe des situations où l’angle de charnière lui-même est important pour votre application. Ces données brutes ne font pas partie de MediaQuery, car cela mettrait à jour l’ensemble de votre application trop souvent. Pour accéder à ces données, vous pouvez utiliser le plug-in flutter dual_screen .

Mesurer l’angle de la charnière

Ajoutez dual_screen à votre section pub.dev dependencies .

dependencies:
  dual_screen: ^1.0.2+2

Importez et utilisez dans vos fichiers de fléchettes.

import 'package:dual_screen/dual_screen_info.dart';

DualScreenInfo.hingeAngleEvents.listen((double hingeAngle) {
  print(hingeAngle);
});

DualScreenInfo.hasHingeAngleSensor.then((bool hasHingeSensor) {
  print(hasHingeSensor);
});

Vous avez maintenant accès à deux nouvelles propriétés statiques :

  • hingeAngleEvents: diffuser le flux d’événements à partir du capteur d’angle de charnière de l’appareil. Si l’appareil n’est pas équipé d’un capteur d’angle de charnière, le flux ne produit aucun événement.
  • hasHingeAngleSensor: retour futur de true si l’appareil a un capteur d’angle de charnière. Sinon, si votre application utilise MediaQuery.displayFeatures déjà ou MediaQuery.hinge pour s’adapter aux facteurs de forme pliables ou à double écran, vous pouvez supposer en toute sécurité que le capteur d’angle de charnière existe et qui hingeAngleEvents produit des valeurs utilisables.

Exemple

Un exemple open source est disponible sur cette page GitHub. Vous pouvez le tester à l’aide des émulateurs pliables standard disponibles dans Android Studio ou de l’émulateur Surface Duo.

Flutter dual_screen exemple en cours d’exécution sur l’émulateur Surface Duo

La différence entre l’émulateur Surface Duo et d’autres appareils ou émulateurs est qu’il prend en charge des angles de charnière de 0 à 360 degrés et qu’il a également deux écrans distincts.

Flutter dual_screen exemple s’exécutant sur un émulateur pliable Android Studio