CODEWITHSUNDEEP
androidvue.jsreact-native
professional debugger
professional debugger

Reputation: 345

How to make my app appear in share list in vue native?

I want to know how you can do that in vue native. I want my app to be able to accept images as well as urls and text

enter image description here

Upvotes: 2

Views: 443

Answers (1)

irtazaakram
irtazaakram

Reputation: 159

This is what you are looking for.From the Link

add these lines to your AndroidManifest file.

<intent-filter>
  <action android:name="android.intent.action.SEND" />
  <category android:name="android.intent.category.DEFAULT" />
  <data android:mimeType="image/*" />
</intent-filter>

your MainActivity.java

package com.sharewithapp;

import com.facebook.react.ReactActivity;

import com.facebook.react.ReactActivityDelegate;
import android.content.Intent;
import android.os.Bundle;
import android.net.Uri;

public class MainActivity extends ReactActivity {

  /**
   * Returns the name of the main component registered from JavaScript. This is used to schedule
   * rendering of the component.
   */
  @Override
  protected String getMainComponentName() {
    return "ShareWithApp";
  }

  @Override
    protected ReactActivityDelegate createReactActivityDelegate() {
        return new ReactActivityDelegate(this, getMainComponentName()) {

            @Override
            protected Bundle getLaunchOptions() {

                Intent intent = MainActivity.this.getIntent();
                Bundle bundle = new Bundle();
                Uri imageUri = intent.getParcelableExtra(Intent.EXTRA_STREAM);
                if (imageUri != null) {
                    bundle.putString("image", imageUri.toString());
                }else{
                    bundle.putString("image", "");
                }

                return bundle;
            }

        };
    }
}

and App.vue file will be

<template>
  <view class="container">
    <text class="text-color-primary">My Vue Native App</text>
            <image
          :style="{width: 50, height: 50}"
          :source="{uri: image}"
        />
  </view>
</template>

<style>
.container {
  background-color: white;
  align-items: center;
  justify-content: center;
  flex: 1;
}
.text-color-primary {
  color: blue;
}
</style>

<script>
export default {
  props: ['image']
}
</script>

More detail on the link.

Upvotes: 1

Related Questions