diff --git a/docs/getting-started.md b/docs/getting-started.md index db2d53372..aaa7601dc 100644 --- a/docs/getting-started.md +++ b/docs/getting-started.md @@ -146,7 +146,6 @@ and install the dependencies by running `pod install`. When you open the Xcode w - We haven't released the dependency to CocoaPods yet, here is the [issue](https://github.com/facebook/flipper/issues/132) by which you can track. - If you do not use CocoaPods as a dependency management tool then currently there is no way to integrate FlipperKit other than manually including all the dependencies and building it. - For Android, Flipper works with both emulators and physical devices connected through USB. However on iOS, we don't yet support physical devices. -- The Flipper layout plugin isn't supported in Swift projects since they include C++ dependencies. We're working on supporting it for Swift apps. You can join the discussion on the [issues page](https://github.com/facebook/flipper/issues). diff --git a/docs/layout-plugin.md b/docs/layout-plugin.md index 8d172ad81..3633517be 100644 --- a/docs/layout-plugin.md +++ b/docs/layout-plugin.md @@ -63,6 +63,8 @@ dependencies { ### iOS +In Objective-C you can add it as follows: + ```objective-c #import #import @@ -71,6 +73,18 @@ SKDescriptorMapper *mapper = [[SKDescriptorMapper alloc] initWithDefaults]; [client addPlugin:[[FlipperKitLayoutPlugin alloc] initWithRootNode:context.application withDescriptorMapper:mapper]] ``` +Whereas in swift you can add it as follows: + +```swift +import FlipperKit + +let layoutDescriptorMapper = SKDescriptorMapper(defaults: ()) +// If you want to debug componentkit view in swift, otherwise you can ignore the next line +FlipperKitLayoutComponentKitSupport.setUpWith(layoutDescriptorMapper) + +client?.add(FlipperKitLayoutPlugin(rootNode: application, with: layoutDescriptorMapper!)) +``` + ## Quick edits The Layout Inspector not only allows you to view the hierarchy and inspect each item's properties, but it also allows you to edit things such as layout attributes, background colors, props, and state. Most things actually. This allows you to quickly tweak paddings, margins, and colors until you are happy with them, all without re-compiling. This can save you many hours implementing a new design. diff --git a/iOS/FlipperKit.podspec b/iOS/FlipperKit.podspec index 3ff3be2f9..dcdf7b83e 100644 --- a/iOS/FlipperKit.podspec +++ b/iOS/FlipperKit.podspec @@ -64,6 +64,11 @@ Pod::Spec.new do |spec| 'iOS/Plugins/FlipperKitNetworkPlugin/FlipperKitNetworkPlugin/SKResponseInfo.h', 'iOS/Plugins/FlipperKitNetworkPlugin/FlipperKitNetworkPlugin/FlipperKitNetworkPlugin.h', 'iOS/Plugins/FlipperKitUserDefaultsPlugin/FKUserDefaultsPlugin.h', + 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin.h', + 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/SKTapListener.h', + 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/SKInvalidation.h', + 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/SKDescriptorMapper.h', + 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutComponentKitSupport/FlipperKitLayoutComponentKitSupport.h', 'iOS/FBDefines/FBMacros.h', 'iOS/FlipperKit/**/{FlipperStateUpdateListener,FlipperClient,FlipperPlugin,FlipperConnection,FlipperResponder,SKMacros}.h' header_search_paths = "\"$(PODS_ROOT)/FlipperKit/iOS/FlipperKit\" \"$(PODS_ROOT)\"/Headers/Private/FlipperKit/** \"$(PODS_ROOT)/boost-for-react-native\" \"$(PODS_ROOT)/DoubleConversion\" \"$(PODS_ROOT)/PeerTalkSonar\"" @@ -78,13 +83,13 @@ Pod::Spec.new do |spec| ss.dependency 'Yoga', yoga_version ss.dependency 'YogaKit', yogakit_version ss.compiler_flags = folly_compiler_flags - ss.public_header_files = 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin.h', - 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/SKTouch.h', - 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/SKDescriptorMapper.h', - 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/SKNodeDescriptor.h', - 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/SKInvalidation.h', - 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/SKNamed.h', + ss.public_header_files = 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin.h', 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/SKTapListener.h', + 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/SKInvalidation.h', + 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/SKDescriptorMapper.h' + ss.private_header_files = 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/SKTouch.h', + 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/SKNodeDescriptor.h', + 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/SKNamed.h', 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/SKObject.h', 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/SKHighlightOverlay.h', 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/UIColor+SKSonarValueCoder.h', @@ -92,6 +97,7 @@ Pod::Spec.new do |spec| 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/utils/SKSwizzle.h', 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/utils/SKYogaKitHelper.h' ss.source_files = 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutPlugin/**/*.{h,cpp,m,mm}' + ss.pod_target_xcconfig = { "HEADER_SEARCH_PATHS" => "\"$(PODS_ROOT)\"/Headers/Private/FlipperKit/**" } end spec.subspec "FlipperKitLayoutComponentKitSupport" do |ss| @@ -102,12 +108,9 @@ Pod::Spec.new do |spec| ss.dependency 'FlipperKit/FlipperKitLayoutPlugin' ss.compiler_flags = folly_compiler_flags ss.dependency 'FlipperKit/FlipperKitLayoutPlugin' - ss.public_header_files = 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutComponentKitSupport/FlipperKitLayoutComponentKitSupport.h', - 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutComponentKitSupport/SKComponentLayoutWrapper.h' - + ss.public_header_files = 'iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutComponentKitSupport/FlipperKitLayoutComponentKitSupport.h' ss.source_files = "iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutComponentKitSupport/**/*.{h,cpp,m,mm}" - ss.pod_target_xcconfig = { "USE_HEADERMAP" => "NO", - "HEADER_SEARCH_PATHS" => "\"$(PODS_ROOT)\"/Headers/Private/FlipperKit/**" } + ss.pod_target_xcconfig = { "HEADER_SEARCH_PATHS" => "\"$(PODS_ROOT)\"/Headers/Private/FlipperKit/**" } end spec.subspec "FlipperKitNetworkPlugin" do |ss| diff --git a/iOS/SampleSwift/Podfile b/iOS/SampleSwift/Podfile index 9d27340c6..5f9c923ba 100644 --- a/iOS/SampleSwift/Podfile +++ b/iOS/SampleSwift/Podfile @@ -10,7 +10,7 @@ target 'SampleSwift' do pod 'FlipperKit/SKIOSNetworkPlugin', :path => '../../FlipperKit.podspec' pod 'FlipperKit/FlipperKitUserDefaultsPlugin', :path => '../../FlipperKit.podspec' # Layout and network plugins are not yet supported for swift projects - #pod 'SonarKit/FlipperKitLayoutComponentKitSupport', :path => '../../SonarKit.podspec' + pod 'FlipperKit/FlipperKitLayoutComponentKitSupport', :path => '../../FlipperKit.podspec' post_install do |installer| installer.pods_project.targets.each do |target| diff --git a/iOS/SampleSwift/Podfile.lock b/iOS/SampleSwift/Podfile.lock index f2f40c527..8735f3dfd 100644 --- a/iOS/SampleSwift/Podfile.lock +++ b/iOS/SampleSwift/Podfile.lock @@ -2,29 +2,40 @@ PODS: - boost-for-react-native (1.63.0) - CocoaAsyncSocket (7.6.3) - CocoaLibEvent (1.0.0) + - ComponentKit (0.24): + - Yoga (~> 1.6) - DoubleConversion (1.1.5) - - Flipper (0.8.1): + - Flipper (0.9.0): - Folly (~> 1.1) - RSocket (~> 0.10) - - FlipperKit (0.8.1): - - FlipperKit/Core (= 0.8.1) - - FlipperKit/Core (0.8.1): + - FlipperKit (0.9.0): + - FlipperKit/Core (= 0.9.0) + - FlipperKit/Core (0.9.0): - CocoaAsyncSocket (~> 7.6) - - Flipper (~> 0.8.1) + - Flipper (~> 0.9.0) - FlipperKit/CppBridge - FlipperKit/FBCxxUtils - FlipperKit/FBDefines - Folly (~> 1.1) - OpenSSL-Static (= 1.0.2.c1) - PeerTalk (~> 0.0.2) - - FlipperKit/CppBridge (0.8.1) - - FlipperKit/FBCxxUtils (0.8.1) - - FlipperKit/FBDefines (0.8.1) - - FlipperKit/FlipperKitNetworkPlugin (0.8.1): + - FlipperKit/CppBridge (0.9.0) + - FlipperKit/FBCxxUtils (0.9.0) + - FlipperKit/FBDefines (0.9.0) + - FlipperKit/FlipperKitLayoutComponentKitSupport (0.9.0): + - ComponentKit - FlipperKit/Core - - FlipperKit/FlipperKitUserDefaultsPlugin (0.8.1): + - FlipperKit/FlipperKitLayoutPlugin + - Yoga (~> 1.9) + - FlipperKit/FlipperKitLayoutPlugin (0.9.0): - FlipperKit/Core - - FlipperKit/SKIOSNetworkPlugin (0.8.1): + - Yoga (~> 1.9) + - YogaKit (~> 1.8) + - FlipperKit/FlipperKitNetworkPlugin (0.9.0): + - FlipperKit/Core + - FlipperKit/FlipperKitUserDefaultsPlugin (0.9.0): + - FlipperKit/Core + - FlipperKit/SKIOSNetworkPlugin (0.9.0): - FlipperKit/Core - FlipperKit/FlipperKitNetworkPlugin - Folly (1.1.0): @@ -38,10 +49,14 @@ PODS: - PeerTalk (0.0.2) - RSocket (0.10.0): - Folly + - Yoga (1.9.0) + - YogaKit (1.9.0): + - Yoga (~> 1.9) DEPENDENCIES: - Flipper (from `../../Flipper.podspec`) - FlipperKit (from `../../FlipperKit.podspec`) + - FlipperKit/FlipperKitLayoutComponentKitSupport (from `../../FlipperKit.podspec`) - FlipperKit/FlipperKitUserDefaultsPlugin (from `../../FlipperKit.podspec`) - FlipperKit/SKIOSNetworkPlugin (from `../../FlipperKit.podspec`) @@ -50,10 +65,13 @@ SPEC REPOS: - boost-for-react-native - CocoaAsyncSocket - CocoaLibEvent + - ComponentKit - DoubleConversion - glog - OpenSSL-Static - https://github.com/facebook/Sonar: + - Yoga + - YogaKit + https://github.com/facebook/Sonar.git: - Folly - PeerTalk - RSocket @@ -68,15 +86,18 @@ SPEC CHECKSUMS: boost-for-react-native: 39c7adb57c4e60d6c5479dd8623128eb5b3f0f2c CocoaAsyncSocket: eafaa68a7e0ec99ead0a7b35015e0bf25d2c8987 CocoaLibEvent: 2fab71b8bd46dd33ddb959f7928ec5909f838e3f + ComponentKit: d6efb627aa2b4592cbe029d1e9e604226d39b5d9 DoubleConversion: e22e0762848812a87afd67ffda3998d9ef29170c - Flipper: 847a9ba40de727f6bb02a1b365674538f051ecf2 - FlipperKit: 93c4d1c38f10ef2900f646ddb65c29bdf4975cfd + Flipper: f911af1131a04bb1e46e2f4eef5e497150e35431 + FlipperKit: 427b587c2442bc0be7e9aa7354a2139637ca8696 Folly: dd92f69322d8535b9df98d7c91e442b0fce2fff2 glog: 1de0bb937dccdc981596d3b5825ebfb765017ded OpenSSL-Static: bd17e34564a8591ad76b740318683a6caa19a13e PeerTalk: 77481b0a8136f226b90ccf828d6061f70139ffde RSocket: 4fdb7e562db30a2d4fceddefdc601749ffc9ebe2 + Yoga: aaae8abea68951f60bee05f6277d3eed90bb91bb + YogaKit: d447a9bb808718e6f58e52a2255a8050081a3ead -PODFILE CHECKSUM: 3eeb7fcb7e93b388b33cfa6730390259dd6292f7 +PODFILE CHECKSUM: da7617cff68c2e61650a9bdd0ca5a588030fd325 COCOAPODS: 1.5.3 diff --git a/iOS/SampleSwift/SampleSwift/AppDelegate.swift b/iOS/SampleSwift/SampleSwift/AppDelegate.swift index 2968f171c..806387382 100644 --- a/iOS/SampleSwift/SampleSwift/AppDelegate.swift +++ b/iOS/SampleSwift/SampleSwift/AppDelegate.swift @@ -13,10 +13,10 @@ class AppDelegate: UIResponder, UIApplicationDelegate { window = UIWindow() let client = FlipperClient.shared() - // Layout and network plugins are currently not supported for Swift apps. -// let layoutDescriptorMapper = SKDescriptorMapper(defaults: ()) -// FlipperKitLayoutComponentKitSupport.setUp(descriptorMapper: layoutDescriptorMapper) -// client.addPlugin(FlipperKitLayoutPlugin(rootNode: application, descriptorMapper: layoutDescriptorMapper)) + let layoutDescriptorMapper = SKDescriptorMapper(defaults: ()) + // If you want to debug componentkit view in swift, otherwise you can ignore the next line + FlipperKitLayoutComponentKitSupport.setUpWith(layoutDescriptorMapper) + client?.add(FlipperKitLayoutPlugin(rootNode: application, with: layoutDescriptorMapper!)) client?.add(FlipperKitNetworkPlugin(networkAdapter: SKIOSNetworkAdapter())) client?.add(FKUserDefaultsPlugin.init(suiteName: nil))