Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Implements feature to influence position of camera controls in horizontal mode #209

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions lib/src/constants/config.dart
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

import '../delegates/camera_picker_text_delegate.dart';
import 'enums.dart';
import 'type_defs.dart';

/// {@template wechat_camera_picker.CameraPickerConfig}
Expand Down Expand Up @@ -35,6 +36,7 @@ class CameraPickerConfig {
this.imageFormatGroup = ImageFormatGroup.unknown,
this.preferredLensDirection = CameraLensDirection.back,
this.preferredFlashMode = FlashMode.off,
this.dominantHand = DominantHand.left,
this.lockCaptureOrientation,
this.foregroundBuilder,
this.previewTransformBuilder,
Expand Down Expand Up @@ -153,6 +155,10 @@ class CameraPickerConfig {
/// 首次使用相机时首选的闪光灯,通常是自动模式。
final FlashMode preferredFlashMode;

/// Influences placement of camera control widgets in horizontal mode.
/// 影响水平模式下相机控制部件的放置。
final DominantHand dominantHand;

/// {@macro wechat_camera_picker.EntitySaveCallback}
final EntitySaveCallback? onEntitySaving;

Expand Down
2 changes: 2 additions & 0 deletions lib/src/constants/enums.dart
Original file line number Diff line number Diff line change
Expand Up @@ -5,3 +5,5 @@
/// Two types for the viewer: image and video.
/// 两种预览类型:图片和视频
enum CameraPickerViewType { image, video }

enum DominantHand { left, right }
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We need docs here, make it as a template so the config can ref it directly.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you please give me an example, as I'm not sure what to do?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Define:

/// {@template wechat_camera_picker.ForegroundBuilder}
/// Build the foreground/overlay widget with the given [CameraValue].
/// 根据给定的 [CameraValue] 构建自定义的前景 widget
///
/// The `controller` will be null until initialized.
/// 在 [CameraController] 完成初始化前,`controller` 将为空。
/// {@endtemplate}

Use:
/// {@macro wechat_camera_picker.ForegroundBuilder}

13 changes: 10 additions & 3 deletions lib/src/states/camera_picker_state.dart
Original file line number Diff line number Diff line change
Expand Up @@ -1635,6 +1635,14 @@ class CameraPickerState extends State<CameraPicker>
);
}

TextDirection determineTextDirection(Enum orientation, DominantHand hand) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Docs too.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Use DeviceOrientation instead of Enum?

Copy link
Author

@fredrik-smedberg fredrik-smedberg Oct 29, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That was my initial thought too, but the code on line 1652 cause issues, specifically:
final orientation = deviceOrientation ?? MediaQuery.of(context).orientation
it's a bit tricky. deviceOrientation is enum of type DeviceOrientation, but MediaQuery.of(context).orientation is enum of type Orientation. The type for final orientation is therefore Enum. DeviceOrientation (four values) doesn't inherit from Orientation (two values).

I realise now that my determineTextDirection will crash if the MediaQuery-method's values are returned. I'll update my code, and then await your feedback on this to see if I should refactor more.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Turn those values into string so you don't need an Enum, like what we've already did.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The name determineTextDirection was not straightforward to understand which part of UI it handles. Consider making it inlined or a more general name.

if (orientation == DeviceOrientation.landscapeRight) {
return hand == DominantHand.left ? TextDirection.rtl : TextDirection.ltr;
} else {
return hand == DominantHand.right ? TextDirection.ltr : TextDirection.rtl;
}
}

Widget buildForegroundBody(
BuildContext context,
BoxConstraints constraints,
Expand All @@ -1647,9 +1655,8 @@ class CameraPickerState extends State<CameraPicker>
padding: const EdgeInsets.only(bottom: 20),
child: Flex(
direction: isPortrait ? Axis.vertical : Axis.horizontal,
textDirection: orientation == DeviceOrientation.landscapeRight
? TextDirection.rtl
: TextDirection.ltr,
textDirection:
determineTextDirection(orientation, pickerConfig.dominantHand),
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Add the trailing comma here.

verticalDirection: orientation == DeviceOrientation.portraitDown
? VerticalDirection.up
: VerticalDirection.down,
Expand Down