docs: add code tabs

Summary: adding code tabs for Android, iOS and C++ to improve readability of pages.

Reviewed By: jknoxville

Differential Revision: D15167691

fbshipit-source-id: e7f602a3a1cbe39ef5da0a15bb0bbfc8f79e8ccc
This commit is contained in:
Daniel Büchele
2019-05-01 11:18:00 -07:00
committed by Facebook Github Bot
parent 8734b99f8d
commit b0d2983bd4
2 changed files with 23 additions and 30 deletions

View File

@@ -7,8 +7,9 @@ title: Mobile Setup
Create a class implementing `FlipperPlugin`. The ID that is returned from your implementation needs to match the `name` defined in your JavaScript counterpart's `package.json`. Create a class implementing `FlipperPlugin`. The ID that is returned from your implementation needs to match the `name` defined in your JavaScript counterpart's `package.json`.
### Android
<!--DOCUSAURUS_CODE_TABS-->
<!--Android-->
```java ```java
public class MyFlipperPlugin implements FlipperPlugin { public class MyFlipperPlugin implements FlipperPlugin {
private FlipperConnection mConnection; private FlipperConnection mConnection;
@@ -34,9 +35,7 @@ public class MyFlipperPlugin implements FlipperPlugin {
} }
} }
``` ```
<!--iOS-->
### iOS
```objective-c ```objective-c
@interface MyFlipperPlugin : NSObject<FlipperPlugin> @interface MyFlipperPlugin : NSObject<FlipperPlugin>
@end @end
@@ -50,9 +49,7 @@ public class MyFlipperPlugin implements FlipperPlugin {
@end @end
``` ```
<!--C++-->
### C++
```c++ ```c++
class MyFlipperPlugin : public FlipperPlugin { class MyFlipperPlugin : public FlipperPlugin {
public: public:
@@ -62,13 +59,15 @@ public:
bool runInBackground() override; bool runInBackground() override;
}; };
``` ```
<!--END_DOCUSAURUS_CODE_TABS-->
## Using FlipperConnection ## Using FlipperConnection
Using the `FlipperConnection` object you can register a receiver of a desktop method call and respond with data. Using the `FlipperConnection` object you can register a receiver of a desktop method call and respond with data.
### Android <!--DOCUSAURUS_CODE_TABS-->
<!--Android-->
```java ```java
connection.receive("getData", new FlipperReceiver() { connection.receive("getData", new FlipperReceiver() {
@Override @Override
@@ -80,9 +79,7 @@ connection.receive("getData", new FlipperReceiver() {
} }
}); });
``` ```
<!--iOS-->
### iOS
```objective-c ```objective-c
@interface MyFlipperPlugin : NSObject<FlipperPlugin> @interface MyFlipperPlugin : NSObject<FlipperPlugin>
@end @end
@@ -104,9 +101,7 @@ connection.receive("getData", new FlipperReceiver() {
@end @end
``` ```
<!--C++-->
### C++
```c++ ```c++
void MyFlipperPlugin::didConnect(std::shared_ptr<FlipperConnection> conn) { void MyFlipperPlugin::didConnect(std::shared_ptr<FlipperConnection> conn) {
conn->receive("getData", [](const folly::dynamic &params, conn->receive("getData", [](const folly::dynamic &params,
@@ -116,34 +111,32 @@ void MyFlipperPlugin::didConnect(std::shared_ptr<FlipperConnection> conn) {
}); });
} }
``` ```
<!--END_DOCUSAURUS_CODE_TABS-->
## Push data to the desktop ## Push data to the desktop
You don't have to wait for the desktop to request data though, you can also push data directly to the desktop. You don't have to wait for the desktop to request data though, you can also push data directly to the desktop.
### Android <!--DOCUSAURUS_CODE_TABS-->
<!--Android-->
```java ```java
connection.send("MyMessage", connection.send("MyMessage",
new FlipperObject.Builder() new FlipperObject.Builder()
.put("message", "Hello") .put("message", "Hello")
.build() .build()
``` ```
<!--iOS-->
### iOS
```objective-c ```objective-c
[connection send:@"getData" withParams:@{@"message":@"hello"}]; [connection send:@"getData" withParams:@{@"message":@"hello"}];
``` ```
<!--C++-->
### C++
```c++ ```c++
void MyFlipperPlugin::didConnect(std::shared_ptr<FlipperConnection> conn) { void MyFlipperPlugin::didConnect(std::shared_ptr<FlipperConnection> conn) {
dynamic message = folly::dynamic::object("message", "hello"); dynamic message = folly::dynamic::object("message", "hello");
conn->send("getData", message); conn->send("getData", message);
} }
``` ```
<!--END_DOCUSAURUS_CODE_TABS-->
## Background Plugins ## Background Plugins

View File

@@ -9,8 +9,9 @@ Plugins should be treated as singleton instances as there can only be one `Flipp
Plugins are identified by the string that their identifier method returns, in this example, "MyFlipperPlugin": Plugins are identified by the string that their identifier method returns, in this example, "MyFlipperPlugin":
### Android
<!--DOCUSAURUS_CODE_TABS-->
<!--Android-->
```java ```java
final FlipperClient client = AndroidFlipperClient.getInstance(context); final FlipperClient client = AndroidFlipperClient.getInstance(context);
// Client may be null if AndroidFlipperClient.createInstance() was never called // Client may be null if AndroidFlipperClient.createInstance() was never called
@@ -20,17 +21,13 @@ if (client != null) {
plugin.sendData(myData); plugin.sendData(myData);
} }
``` ```
<!--iOS-->
### iOS
```objective-c ```objective-c
FlipperClient *client = [FlipperClient sharedClient]; FlipperClient *client = [FlipperClient sharedClient];
MyFlipperPlugin *myPlugin = [client pluginWithIdentifier:@"MyFlipperPlugin"]; MyFlipperPlugin *myPlugin = [client pluginWithIdentifier:@"MyFlipperPlugin"];
[myPlugin sendData:myData]; [myPlugin sendData:myData];
``` ```
<!--C++-->
### C++
```c++ ```c++
auto &client = FlipperClient::instance(); auto &client = FlipperClient::instance();
@@ -45,5 +42,8 @@ myPlugin = client.getPlugin<MyFlipperPlugin>("MyFlipperPlugin");
myPlugin->sendData(myData); myPlugin->sendData(myData);
``` ```
```
<!--END_DOCUSAURUS_CODE_TABS-->
Here, `sendData` is an example of a method that might be implemented by the Flipper plugin. Here, `sendData` is an example of a method that might be implemented by the Flipper plugin.