fix(ios): fix issue where viewport size was never set (#98)

margelo · Apr 9, 2024 · 7bfb273 · 7bfb273
1 parent b515d72
commit 7bfb273
Show file tree

Hide file tree

Showing 5 changed files with 35 additions and 28 deletions.
diff --git a/package/cpp/core/EngineWrapper.cpp b/package/cpp/core/EngineWrapper.cpp
@@ -224,6 +224,7 @@ void EngineWrapper::setIsPaused(bool isPaused) {
 
 void EngineWrapper::surfaceSizeChanged(int width, int height) {
   if (_cameraManipulator) {
+    Logger::log(TAG, "Updating viewport size to %d x %d", width, height);
     _cameraManipulator->getManipulator()->setViewport(width, height);
   }
   if (_view) {

diff --git a/package/example/ios/FilamentExample.xcodeproj/project.pbxproj b/package/example/ios/FilamentExample.xcodeproj/project.pbxproj
@@ -18,14 +18,14 @@
 		279D0EC5EF2A4391BD041C64 /* box.glb in Resources */ = {isa = PBXBuildFile; fileRef = 9241FD2E35834E6CBD6537B9 /* box.glb */; };
 		4F84B0412C634799AEFB1D85 /* eye_full_texture_left_blue.jpg in Resources */ = {isa = PBXBuildFile; fileRef = 134904F01F7041DFA331FD27 /* eye_full_texture_left_blue.jpg */; };
 		59249653BB174593BEDB9F3D /* pengu.glb in Resources */ = {isa = PBXBuildFile; fileRef = 3E2439B417DA497E83EB1F05 /* pengu.glb */; };
+		5E98C72EE19242D6A0DF2197 /* coin.glb in Resources */ = {isa = PBXBuildFile; fileRef = 2AA4B0B6F62641A797E627AD /* coin.glb */; };
 		7699B88040F8A987B510C191 /* libPods-FilamentExample-FilamentExampleTests.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 19F6CBCC0A4E27FBF8BF4A61 /* libPods-FilamentExample-FilamentExampleTests.a */; };
 		81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */; };
 		94671BF6DAD54DF8A7B842C3 /* pirate.glb in Resources */ = {isa = PBXBuildFile; fileRef = 034C2E5BF6EE449290528E8D /* pirate.glb */; };
 		9D9B37A8229643988DE97B73 /* chair.glb in Resources */ = {isa = PBXBuildFile; fileRef = C4E5AB69D2B94D53A2EE3F93 /* chair.glb */; };
 		BDF34253C8964E78A0DCEAD2 /* eye_full_texture_right_blue.jpg in Resources */ = {isa = PBXBuildFile; fileRef = 70AE03ED5F1844C6832C78BC /* eye_full_texture_right_blue.jpg */; };
 		C9D96BF6335F42C0A265B183 /* TransparentShadowMaterial.matc in Resources */ = {isa = PBXBuildFile; fileRef = 0409EC28377B45A494FCD7A6 /* TransparentShadowMaterial.matc */; };
 		FFD6B311C32A4A2580B289D7 /* default_env_skybox.ktx in Resources */ = {isa = PBXBuildFile; fileRef = A947E59D16164B19982D8EC8 /* default_env_skybox.ktx */; };
-		5E98C72EE19242D6A0DF2197 /* coin.glb in Resources */ = {isa = PBXBuildFile; fileRef = 2AA4B0B6F62641A797E627AD /* coin.glb */; };
 /* End PBXBuildFile section */
 
 /* Begin PBXContainerItemProxy section */
@@ -52,6 +52,7 @@
 		13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = FilamentExample/Info.plist; sourceTree = "<group>"; };
 		13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = FilamentExample/main.m; sourceTree = "<group>"; };
 		19F6CBCC0A4E27FBF8BF4A61 /* libPods-FilamentExample-FilamentExampleTests.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-FilamentExample-FilamentExampleTests.a"; sourceTree = BUILT_PRODUCTS_DIR; };
+		2AA4B0B6F62641A797E627AD /* coin.glb */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = coin.glb; path = ../assets/coin.glb; sourceTree = "<group>"; };
 		3B4392A12AC88292D35C810B /* Pods-FilamentExample.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-FilamentExample.debug.xcconfig"; path = "Target Support Files/Pods-FilamentExample/Pods-FilamentExample.debug.xcconfig"; sourceTree = "<group>"; };
 		3BB2032A44844768B124B936 /* TransparentShadowMaterial.mat */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = TransparentShadowMaterial.mat; path = ../assets/TransparentShadowMaterial.mat; sourceTree = "<group>"; };
 		3E2439B417DA497E83EB1F05 /* pengu.glb */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = pengu.glb; path = ../assets/pengu.glb; sourceTree = "<group>"; };
@@ -67,7 +68,6 @@
 		BE173E0B3B23427D84C92C91 /* pijamas.glb */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = pijamas.glb; path = ../assets/pijamas.glb; sourceTree = "<group>"; };
 		C4E5AB69D2B94D53A2EE3F93 /* chair.glb */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = chair.glb; path = ../assets/chair.glb; sourceTree = "<group>"; };
 		ED297162215061F000B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = System/Library/Frameworks/JavaScriptCore.framework; sourceTree = SDKROOT; };
-		2AA4B0B6F62641A797E627AD /* coin.glb */ = {isa = PBXFileReference; name = "coin.glb"; path = "../assets/coin.glb"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
 /* End PBXFileReference section */
 
 /* Begin PBXFrameworksBuildPhase section */

diff --git a/package/example/ios/Podfile.lock b/package/example/ios/Podfile.lock
@@ -886,89 +886,89 @@ PODS:
   - React-Mapbuffer (0.73.4):
     - glog
     - React-debug
-  - react-native-filament (0.13.1):
+  - react-native-filament (0.19.1):
     - glog
     - RCT-Folly (= 2022.05.16.00)
     - React-Core
-    - react-native-filament/camutils (= 0.13.1)
-    - react-native-filament/filamat (= 0.13.1)
-    - react-native-filament/filament (= 0.13.1)
-    - react-native-filament/gltfio_core (= 0.13.1)
-    - react-native-filament/image (= 0.13.1)
-    - react-native-filament/ktxreader (= 0.13.1)
-    - react-native-filament/math (= 0.13.1)
-    - react-native-filament/tsl (= 0.13.1)
-    - react-native-filament/uberz (= 0.13.1)
-    - react-native-filament/utils (= 0.13.1)
+    - react-native-filament/camutils (= 0.19.1)
+    - react-native-filament/filamat (= 0.19.1)
+    - react-native-filament/filament (= 0.19.1)
+    - react-native-filament/gltfio_core (= 0.19.1)
+    - react-native-filament/image (= 0.19.1)
+    - react-native-filament/ktxreader (= 0.19.1)
+    - react-native-filament/math (= 0.19.1)
+    - react-native-filament/tsl (= 0.19.1)
+    - react-native-filament/uberz (= 0.19.1)
+    - react-native-filament/utils (= 0.19.1)
     - react-native-worklets-core
-  - react-native-filament/camutils (0.13.1):
+  - react-native-filament/camutils (0.19.1):
     - glog
     - RCT-Folly (= 2022.05.16.00)
     - React-Core
     - react-native-filament/math
     - react-native-worklets-core
-  - react-native-filament/filamat (0.13.1):
+  - react-native-filament/filamat (0.19.1):
     - glog
     - RCT-Folly (= 2022.05.16.00)
     - React-Core
     - react-native-filament/math
     - react-native-filament/utils
     - react-native-worklets-core
-  - react-native-filament/filament (0.13.1):
+  - react-native-filament/filament (0.19.1):
     - glog
     - RCT-Folly (= 2022.05.16.00)
     - React-Core
     - react-native-filament/math
     - react-native-filament/utils
     - react-native-worklets-core
-  - react-native-filament/gltfio_core (0.13.1):
+  - react-native-filament/gltfio_core (0.19.1):
     - glog
     - RCT-Folly (= 2022.05.16.00)
     - React-Core
     - react-native-filament/filament
     - react-native-filament/ktxreader
     - react-native-filament/uberz
     - react-native-worklets-core
-  - react-native-filament/image (0.13.1):
+  - react-native-filament/image (0.19.1):
     - glog
     - RCT-Folly (= 2022.05.16.00)
     - React-Core
     - react-native-filament/filament
     - react-native-worklets-core
-  - react-native-filament/ktxreader (0.13.1):
+  - react-native-filament/ktxreader (0.19.1):
     - glog
     - RCT-Folly (= 2022.05.16.00)
     - React-Core
     - react-native-filament/filament
     - react-native-filament/image
     - react-native-worklets-core
-  - react-native-filament/math (0.13.1):
+  - react-native-filament/math (0.19.1):
     - glog
     - RCT-Folly (= 2022.05.16.00)
     - React-Core
     - react-native-worklets-core
-  - react-native-filament/tsl (0.13.1):
+  - react-native-filament/tsl (0.19.1):
     - glog
     - RCT-Folly (= 2022.05.16.00)
     - React-Core
     - react-native-worklets-core
-  - react-native-filament/uberz (0.13.1):
+  - react-native-filament/uberz (0.19.1):
     - glog
     - RCT-Folly (= 2022.05.16.00)
     - React-Core
     - react-native-filament/filamat
     - react-native-filament/tsl
     - react-native-filament/utils
     - react-native-worklets-core
-  - react-native-filament/utils (0.13.1):
+  - react-native-filament/utils (0.19.1):
     - glog
     - RCT-Folly (= 2022.05.16.00)
     - React-Core
     - react-native-filament/tsl
     - react-native-worklets-core
   - react-native-safe-area-context (4.9.0):
     - React-Core
-  - react-native-worklets-core (0.4.0):
+  - react-native-worklets-core (0.5.0):
     - React
     - React-callinvoker
     - React-Core
@@ -1346,9 +1346,9 @@ SPEC CHECKSUMS:
   React-jsinspector: 9ac353eccf6ab54d1e0a33862ba91221d1e88460
   React-logger: 0a57b68dd2aec7ff738195f081f0520724b35dab
   React-Mapbuffer: 63913773ed7f96b814a2521e13e6d010282096ad
-  react-native-filament: 61ac6e984c5bd920f57411aa1fafb24801261ce8
+  react-native-filament: 2ac21fa77b9e9bf9f7048319d7ab12fbe1d307da
   react-native-safe-area-context: b97eb6f9e3b7f437806c2ce5983f479f8eb5de4b
-  react-native-worklets-core: 2efe80a3ee87fe5e6fefa814e0e20c2708d3ad25
+  react-native-worklets-core: ba5a1d4f91be4edd8cf09537a9b8fa46a7f70436
   React-nativeconfig: d7af5bae6da70fa15ce44f045621cf99ed24087c
   React-NativeModulesApple: 0123905d5699853ac68519607555a9a4f5c7b3ac
   React-perflogger: 8a1e1af5733004bdd91258dcefbde21e0d1faccd

diff --git a/package/example/src/WorkletExample.tsx b/package/example/src/WorkletExample.tsx
@@ -16,8 +16,8 @@ import { useDefaultLight } from './hooks/useDefaultLight'
 import { Config } from './config'
 
 const penguModelPath = Platform.select({
-  android: 'custom/igloo.glb',
-  ios: 'igloo.glb',
+  android: 'custom/pengu.glb',
+  ios: 'pengu.glb',
 })!
 
 function blockJS(): number {

diff --git a/package/ios/src/FilamentMetalView.mm b/package/ios/src/FilamentMetalView.mm
@@ -38,7 +38,13 @@ - (void)layoutSubviews {
   [super layoutSubviews];
   CGFloat scale = [UIScreen mainScreen].scale;
   CGSize newSize = CGSizeMake(self.bounds.size.width * scale, self.bounds.size.height * scale);
+
+  // TODO: usually the setter function for drawableSize should be auto wrapped with
+  // will- and didChange, however for some reason it seems it isn't. Without it the
+  // KVO pattern would break and we would never be notified when the view size changes.
+  [self.metalLayer willChangeValueForKey:@"drawableSize"];
   self.metalLayer.drawableSize = newSize;
+  [self.metalLayer didChangeValueForKey:@"drawableSize"];
 }
 
 @end