CODEWITHSUNDEEP
javascriptjavareact-nativeadmob
cratag
cratag

Reputation: 122

Can't add AdMob to my project: My project is ReactNative and AdMob needs JAVA

I'm trying to add an ad to my app. Following this guide, I've ran into trouble with "Initialize the Mobile Ads SDK" for it wants me to import some Java code:

package ...
import ...
import com.google.android.gms.ads.MobileAds;
import com.google.android.gms.ads.initialization.InitializationStatus;
import com.google.android.gms.ads.initialization.OnInitializationCompleteListener;

public class MainActivity extends AppCompatActivity {

    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        MobileAds.initialize(this, new OnInitializationCompleteListener() {
            @Override
            public void onInitializationComplete(InitializationStatus initializationStatus) {
            }
        });
    }
}

and I've got a Javascript project:

import React from 'react';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';

import React from 'react';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';

import Home from "./screens/home"
import heads from "./screens/heads"
import tails from "./screens/tails"

//problems start from here. This is the copied text from https://developers.google.com/admob/android/quick-start?hl=es#import_the_mobile_ads_sdk
package ...
import ...
import com.google.android.gms.ads.MobileAds;
import com.google.android.gms.ads.initialization.InitializationStatus;
import com.google.android.gms.ads.initialization.OnInitializationCompleteListener;

public class MainActivity extends AppCompatActivity {

    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        MobileAds.initialize(this, new OnInitializationCompleteListener() {
            @Override
            public void onInitializationComplete(InitializationStatus initializationStatus) {
            }
        });
    }
}
//this is where they end
const Stack = createStackNavigator();


function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator initialRouteName="Home">
        <Stack.Screen 
        name="Home" 
        component={Home}
        options={{headerShown: false}} />
        <Stack.Screen 
        name="tails" 
        component={tails}
        options={{headerShown: false}} />
        <Stack.Screen 
        name="heads" 
        component={heads}
        options={{headerShown: false}} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

export default App;

const Stack = createStackNavigator();

Errors

This is the output when trying to access the app:

App.js: Unexpected reserved word 'package' (10:0)

   8 | 
   9 | //problems start from here. This is the copied text from https://developers.google.com/admob/android/quick-start?hl=es#import_the_mobile_ads_sdk
> 10 | package ...
     | ^
  11 | import ...
  12 | import com.google.android.gms.ads.MobileAds;
  13 | import com.google.android.gms.ads.initialization.InitializationStatus;

I'm not sure if I should be converting JAVA into JAVASCRIPT for this purpose in particular. I've found nothing on the internet around it, and there's no "translator" for programming languages as far as I know.

I'm clueless. I've already tried the same thing with KOTLIN but it failed as well. I don't want to add the KOTLIN code and the errors because it says that my post is mostly code (and it certainly is, but I don't know towards which direction to go from here) Thank you!

Upvotes: 1

Views: 408

Answers (1)

Ibz
Ibz

Reputation: 437

Ok so it looks as though you're trying to put Java and JavaScript code in the same file, which won't work.

In your included javascript project snippet, this whole section:

//problems start from here. This is the copied text from https://developers.google.com/admob/android/quick-start?hl=es#import_the_mobile_ads_sdk
package ...
import ...
import com.google.android.gms.ads.MobileAds;
import com.google.android.gms.ads.initialization.InitializationStatus;
import com.google.android.gms.ads.initialization.OnInitializationCompleteListener;

public class MainActivity extends AppCompatActivity {

    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        MobileAds.initialize(this, new OnInitializationCompleteListener() {
            @Override
            public void onInitializationComplete(InitializationStatus initializationStatus) {
            }
        });
    }
}
//this is where they end

Would need to be in a separate Java file.

Now, I see you're using react-native. I would need to know if you're using standard react-native or an expo managed project.

If you are using an expo managed project, there is already a package made for admob, just follow the instructions in the documentation here: https://docs.expo.io/versions/v39.0.0/sdk/admob/

If you are just using react native, it gets quite a bit more complicated. The docs that you provided are intended for Java / Kotlin native development opposed to native development through react, so it will be hard for you to get it working using the code from that document. This link should help you get it working for react-native: https://dev.to/srajesh636/how-to-show-ads-in-react-native-lcj

*note that in the included docs provided by google, where you see package ... and import ..., you're expected to fill in your actual package name, and any other imports you need for the class.

Hopefully this has provided some insight on your problem, let me know if there are still any issues.

Upvotes: 2

Related Questions