如何在 Android Studio 中将任何网站转换为 Android 应用程序？

在这里，我们将为“GeeksForGeeks”网站制作一个应用程序。通过制作这个应用程序，我们将能够学习如何通过以下简单的步骤将网站转换为 Android 应用程序。您也可以将这个概念用于您的个人网站并学习新的东西。

我们将在本文中构建什么？

在这个应用程序中，我们将学习如何使用网站的不同门户并将它们显示为我们的 android 应用程序中的片段。在此应用程序中，Geeksforgeeks 网站的三个门户 – Home、Practice 和 Contribute 将用作我们应用程序中的片段。因此，您可以看到将网站转换为应用程序的现场示例。 WebView 的概念就是用来做这个需要的工作的。下面给出了一个示例视频，以了解我们将在本文中做什么。请注意，我们将使用Java语言来实现这个项目。

将您的网站转换为 Android 应用程序的简单步骤：

• 添加应用程序的徽标。
• 向您的应用程序添加启动画面。
• 在我们的应用程序中使用导航抽屉，以便我们网站的不同门户可以用作导航抽屉中的片段。
• 使用 WebView 以便可以轻松访问 Web 内容。
• 使用 WebViewController 类使网站上的内容可以直接显示在应用程序中，而不是在浏览器中打开。
• 添加帮助热线活动。

通过遵循这些步骤，您可以以最简单的方式将您的网站转换为应用程序。因此，让我们看看将 GeeksForGeeks 网站转换为应用程序的分步实施。

分步实施

第 1 步：创建一个新项目

• 打开一个新项目。
• 我们将使用Java语言开发 Navigation Drawer Activity。保持所有其他选项不变。
• 您可以在方便时更改项目的名称。
• 会有很多默认文件。

如果您不知道如何在 Android Studio 中创建新项目，那么您可以参考如何在 Android Studio 中创建/启动新项目？

第 2 步：向我们的应用程序添加徽标

• 将应用程序的徽标粘贴到res > drawable 中。
• 请按照“如何更改 Android 应用程序的默认图标”了解更多步骤。

第 3 步：将启动画面添加到我们的应用程序中

按照-“创建启动画面”了解如何向我们的应用程序添加启动画面。我们的应用程序启动画面的示例设计。

第 4 步：使用 xml 文件

打开layout > nav_header_main.xml文件来设计我们的 Navigation Drawer 的标题。为此，请在其中使用以下代码。

执行上述代码后，Navigation Drawer 的头部如下所示：

将操作栏的颜色更改为“# 6C6B74 ”，这样它可以匹配我们应用程序标志的颜色代码，我们的 UI 可以变得更有吸引力。如果您不知道如何更改 ActionBar 的颜色，那么您可以单击此处进行学习。打开menu > activity_main_drawer.xml文件并在其中使用以下代码，以便我们可以将不同的项目（我们网站的门户）添加到我们的导航抽屉并使用它们的片段。

执行上述代码后，我们的activity_main_drawer.xml文件的设计如下所示。

转到layout > activity_main.xml并在其中使用以下代码。

执行完上面的代码设计的activity_main.xml文件长这样。

转到导航 > mobile_navigation.xml文件并在其中使用以下代码，以便我们可以指定我们网站门户的标题和标签，并可以轻松地在Java文件中使用它们。

现在是时候在所有片段中插入 WebView – 打开fragment_home、fragment_gallery、fragment_slideshow XML 文件并分别使用代码。

现在我们必须创建一个名为“ help ”的新活动。这样，应用程序用户就可以获得信息以从服务提供商那里获得帮助。转到布局>右键单击>新建>活动>空活动

根据您的选择输入活动的名称（此应用程序中使用的名称-“帮助”）。打开layout > activity_help.xml并在其中使用以下代码。

实现上面的代码后，activity_help.xml 文件的设计是这样的。

现在我们添加了一段代码来获取访问互联网的权限，以便我们的 WebView 可以轻松工作。转到manifests > AndroidManifest.xml文件并将以下代码添加到其中。

第 5 步：使用Java文件

创建一个新的Java类，如下所示，并将其命名为“ WebViewController ”

在WebViewController 中使用以下代码。 Java文件，以便可以执行使用网站 URL 的代码。

Java

package com.example.geeksforgeeks;
  
import android.webkit.WebView;
import android.webkit.WebViewClient;
  
// class is extended to WebViewClient to access the WebView 
public class WebViewController extends WebViewClient {
    @Override
    public boolean shouldOverrideUrlLoading(WebView view, String url) {
        // loadurl function will load the 
        // url we will provide to our webview  
        view.loadUrl(url);
        return true;
    }
}

打开HomeFragment、GalleryFragment、SlideshowFragment Java文件，分别使用代码。

Java

package com.example.geeksforgeeks.ui.home;
  
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.webkit.WebView;
  
import androidx.annotation.NonNull;
import androidx.fragment.app.Fragment;
import androidx.lifecycle.ViewModelProvider;
  
import com.example.geeksforgeeks.R;
import com.example.geeksforgeeks.WebViewController;
  
public class HomeFragment extends Fragment {
  
    private HomeViewModel homeViewModel;
  
    public View onCreateView(@NonNull LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
          
        homeViewModel = new ViewModelProvider(this).get(HomeViewModel.class);
        View root = inflater.inflate(R.layout.fragment_home, container, false);
  
        // Created a WebView and used the loadurl method to give url to WebViewController class
        WebView webView = root.findViewById(R.id.web_view_home);
        webView.loadUrl("https://www.geeksforgeeks.org/");  // Url of portal is passed
        webView.setWebViewClient(new WebViewController());  // WebViewController is used
        return root;
    }
}

Java

package com.example.geeksforgeeks.ui.gallery;
  
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.webkit.WebView;
  
import androidx.annotation.NonNull;
import androidx.fragment.app.Fragment;
import androidx.lifecycle.ViewModelProvider;
  
import com.example.geeksforgeeks.R;
import com.example.geeksforgeeks.WebViewController;
  
public class GalleryFragment extends Fragment {
  
    private GalleryViewModel galleryViewModel;
  
    public View onCreateView(@NonNull LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
          
        galleryViewModel = new ViewModelProvider(this).get(GalleryViewModel.class);
        View root = inflater.inflate(R.layout.fragment_gallery, container, false);
  
        WebView webView = root.findViewById(R.id.web_view_practice);
        webView.loadUrl("https://practice.geeksforgeeks.org/");
        webView.setWebViewClient(new WebViewController());
        return root;
    }
}

Java

package com.example.geeksforgeeks.ui.slideshow;
  
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.webkit.WebView;
  
import androidx.annotation.NonNull;
import androidx.fragment.app.Fragment;
import androidx.lifecycle.ViewModelProvider;
  
import com.example.geeksforgeeks.R;
import com.example.geeksforgeeks.WebViewController;
  
public class SlideshowFragment extends Fragment {
  
    private SlideshowViewModel slideshowViewModel;
  
    public View onCreateView(@NonNull LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
          
        slideshowViewModel = new ViewModelProvider(this).get(SlideshowViewModel.class);
        View root = inflater.inflate(R.layout.fragment_slideshow, container, false);
  
        WebView webView = root.findViewById(R.id.web_view_contribute);
        webView.loadUrl("https://write.geeksforgeeks.org/");
        webView.setWebViewClient(new WebViewController());
        return root;
    }
}

现在我们所有的工作都完成了，最后的工作是在MainActivity的意图帮助下将帮助活动连接到我们应用程序中的浮动按钮。 Java文件。使用以下代码执行此操作。

Java

package com.example.geeksforgeeks;
  
import android.content.Intent;
import android.os.Bundle;
import android.view.Menu;
import android.view.View;
  
import androidx.appcompat.app.AppCompatActivity;
import androidx.appcompat.widget.Toolbar;
import androidx.drawerlayout.widget.DrawerLayout;
import androidx.navigation.NavController;
import androidx.navigation.Navigation;
import androidx.navigation.ui.AppBarConfiguration;
import androidx.navigation.ui.NavigationUI;
  
import com.google.android.material.floatingactionbutton.FloatingActionButton;
import com.google.android.material.navigation.NavigationView;
  
public class MainActivity extends AppCompatActivity {
  
    private AppBarConfiguration mAppBarConfiguration;
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Toolbar toolbar = findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
  
        // Code for floating button
        FloatingActionButton fab = findViewById(R.id.fab);
  
        // On click listener is used on floating button
        // to redirect to help activity
        fab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // Intent is used to connect help activity to floating button
                Intent activity2Intent = new Intent(getApplicationContext(), help.class);
                startActivity(activity2Intent);
            }
        });
  
        // default code for drawer layout and navigation view
        DrawerLayout drawer = findViewById(R.id.drawer_layout);
        NavigationView navigationView = findViewById(R.id.nav_view);
  
        // Passing each menu ID as a set of Ids because each
        // menu should be considered as top level destinations.
        mAppBarConfiguration = new AppBarConfiguration.Builder(
                R.id.nav_home, R.id.nav_gallery, R.id.nav_slideshow)
                .setDrawerLayout(drawer)
                .build();
  
        // default code to control the navigation view
        NavController navController = Navigation.findNavController(this, R.id.nav_host_fragment);
        NavigationUI.setupActionBarWithNavController(this, navController, mAppBarConfiguration);
        NavigationUI.setupWithNavController(navigationView, navController);
    }
  
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items
        // to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }
  
    @Override
    public boolean onSupportNavigateUp() {
        NavController navController = Navigation.findNavController(this, R.id.nav_host_fragment);
        return NavigationUI.navigateUp(navController, mAppBarConfiguration)
                || super.onSupportNavigateUp();
    }
}

Note: In MainActivity.java whole code is by default or pre-existing we have just added intent code to connect help activity with the floating button.

输出：

如果你想寻求帮助或导入项目，那么你可以访问 GitHub 链接： https : //github.com/Karan-Jangir/GeeksForGeeks/tree/master