Desktop: Add an 'Enable V-Sync' preference on Mac (#3887)

* add vsync pref

* account for physical scale in pixel preview passthru check

* change allow to expect attr

* Update user-facing v-sync text

---------

Co-authored-by: Keavon Chambers <keavon@keavon.com>

editor/src/messages/dialog/preferences_dialog/preferences_dialog_message_handler.rs

@@ -387,9 +387,44 @@ impl PreferencesDialogMessageHandler {
 
 				rows.push(ui_acceleration);
 			}
+
+			#[cfg(target_os = "macos")]
+			{
+				let vsync_description = "
+					Render frames with vertical synchronization (v-sync) to prevent visual tearing within Graphite and the operating system compositor. This introduces increased input latency which is more noticeable on lower refresh rate displays. Future versions of Graphite will aim to reduce the macOS-specific latency without tearing artifacts.\n\
+					\n\
+					The application will restart for this change to take effect.\n\
+					\n\
+					*Default: Off.*
+					"
+				.trim();
+
+				let checkbox_id = CheckboxId::new();
+				let vsync_checked = preferences.vsync;
+
+				let vsync = vec![
+					Separator::new(SeparatorStyle::Unrelated).widget_instance(),
+					Separator::new(SeparatorStyle::Unrelated).widget_instance(),
+					CheckboxInput::new(vsync_checked)
+						.tooltip_label("Enable V-Sync")
+						.tooltip_description(vsync_description)
+						.on_update(|checkbox_input: &CheckboxInput| Message::Batched {
+							messages: Box::new([PreferencesDialogMessage::MayRequireRestart.into(), PreferencesMessage::VSync { vsync: checkbox_input.checked }.into()]),
+						})
+						.for_label(checkbox_id)
+						.widget_instance(),
+					TextLabel::new("Enable V-Sync")
+						.tooltip_label("Enable V-Sync")
+						.tooltip_description(vsync_description)
+						.for_checkbox(checkbox_id)
+						.widget_instance(),
+				];
+
+				rows.push(vsync);
+			}
 		}
 
-		Layout(rows.into_iter().map(|r| LayoutGroup::row(r)).collect())
+		Layout(rows.into_iter().map(LayoutGroup::row).collect())
 	}
 
 	pub fn send_layout(&self, responses: &mut VecDeque<Message>, layout_target: LayoutTarget, preferences: &PreferencesMessageHandler) {

editor/src/messages/preferences/preferences_message.rs

@@ -6,16 +6,38 @@ use crate::messages::prelude::*;
 #[derive(PartialEq, Clone, Debug, serde::Serialize, serde::Deserialize)]
 pub enum PreferencesMessage {
 	// Management messages
-	Load { preferences: PreferencesMessageHandler },
+	Load {
+		preferences: PreferencesMessageHandler,
+	},
 	ResetToDefaults,
 
 	// Per-preference messages
-	SelectionMode { selection_mode: SelectionMode },
-	BrushTool { enabled: bool },
-	ModifyLayout { zoom_with_scroll: bool },
-	GraphWireStyle { style: GraphWireStyle },
-	ViewportZoomWheelRate { rate: f64 },
-	UIScale { scale: f64 },
-	DisableUIAcceleration { disable_ui_acceleration: bool },
-	MaxRenderRegionSize { size: u32 },
+	SelectionMode {
+		selection_mode: SelectionMode,
+	},
+	BrushTool {
+		enabled: bool,
+	},
+	ModifyLayout {
+		zoom_with_scroll: bool,
+	},
+	GraphWireStyle {
+		style: GraphWireStyle,
+	},
+	ViewportZoomWheelRate {
+		rate: f64,
+	},
+	UIScale {
+		scale: f64,
+	},
+	MaxRenderRegionSize {
+		size: u32,
+	},
+	DisableUIAcceleration {
+		disable_ui_acceleration: bool,
+	},
+	#[cfg(target_os = "macos")]
+	VSync {
+		vsync: bool,
+	},
 }

editor/src/messages/preferences/preferences_message_handler.rs

@@ -21,15 +21,23 @@ pub struct PreferencesMessageHandler {
 	pub graph_wire_style: GraphWireStyle,
 	pub viewport_zoom_wheel_rate: f64,
 	pub ui_scale: f64,
-	pub disable_ui_acceleration: bool,
 	pub max_render_region_size: u32,
+	pub disable_ui_acceleration: bool,
+	#[cfg(target_os = "macos")]
+	pub vsync: bool,
 }
 
 impl PreferencesMessageHandler {
+	#[cfg(not(target_os = "macos"))]
 	pub fn needs_restart(&self, other: &Self) -> bool {
 		self.disable_ui_acceleration != other.disable_ui_acceleration
 	}
 
+	#[cfg(target_os = "macos")]
+	pub fn needs_restart(&self, other: &Self) -> bool {
+		self.disable_ui_acceleration != other.disable_ui_acceleration || self.vsync != other.vsync
+	}
+
 	pub fn get_selection_mode(&self) -> SelectionMode {
 		self.selection_mode
 	}
@@ -54,8 +62,10 @@ impl Default for PreferencesMessageHandler {
 			graph_wire_style: GraphWireStyle::default(),
 			viewport_zoom_wheel_rate: VIEWPORT_ZOOM_WHEEL_RATE,
 			ui_scale: UI_SCALE_DEFAULT,
-			disable_ui_acceleration: false,
 			max_render_region_size: EditorPreferences::default().max_render_region_size,
+			disable_ui_acceleration: false,
+			#[cfg(target_os = "macos")]
+			vsync: false,
 		}
 	}
 }
@@ -112,14 +122,18 @@ impl MessageHandler<PreferencesMessage, PreferencesMessageContext<'_>> for Prefe
 				self.ui_scale = scale;
 				responses.add(FrontendMessage::UpdateUIScale { scale: self.ui_scale });
 			}
-			PreferencesMessage::DisableUIAcceleration { disable_ui_acceleration } => {
-				self.disable_ui_acceleration = disable_ui_acceleration;
-			}
 			PreferencesMessage::MaxRenderRegionSize { size } => {
 				self.max_render_region_size = size;
 				responses.add(PortfolioMessage::EditorPreferences);
 				responses.add(NodeGraphMessage::RunDocumentGraph);
 			}
+			PreferencesMessage::DisableUIAcceleration { disable_ui_acceleration } => {
+				self.disable_ui_acceleration = disable_ui_acceleration;
+			}
+			#[cfg(target_os = "macos")]
+			PreferencesMessage::VSync { vsync } => {
+				self.vsync = vsync;
+			}
 		}
 
 		responses.add(FrontendMessage::TriggerSavePreferences { preferences: self.clone() });