woxel.ru  / Статьи /  

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл

01 ноябрь 2022   0   Android, Веб

Android Studio

В этом руководстве/инструкции, пойдет речь об ответе на следующие вопросы:

  • Как конвертировать html в apk приложение Андроид?
  • Как конвертировать веб-страницу в андроид приложение?
  • Как конвертировать веб-сайт в apk-файл (Андроид приложение), через Android Studio?
  • Как создать Андроид-приложение без программирования?

Сами веб-сайты и веб-страницы, можно создать и без программирования, используя такие программы как WYSIWYG Web Builder.

Она легка в использовании, и создает веб сайты/страницы, которые легко поддерживаются смартфоном при конвертации в APK-файл Андроид-приложения.


Важное примечание

При создании html-сайта/страницы для конвертации в APK приложение надо учесть, что смартфоны не поддерживают такие технологии, как WebGL (3D графика), PHP и т.д.

При конвертации сайта/страницы с использование этих и подобных технологий, содержимое html-страницы может не отображаться или некорректно работать.

Спокойно конвертируются и корректно работают html-страницы с простыми js-файлами (скриптами).


Алгоритм конвертации html-сайта в APK файл андроид-приложения

1. Запускаем Android Studio и в меню File выбираем New-New project.

В появившемся окне выбираем вариант - Empty Activity.

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл


2. Когда мы выделим вариант Empty Activity и нажмем кнопку Next, появится следующее окно с заголовком New project.

Здесь обязательно, в пункте Language (Язык), надо выбрать вариант Java, а не Kotlin. Так как, далее предоставленный код, предназначен именно под язык программирования Java, и не будет работать при варианте Kotlin.

В пункте Name (Имя), пишите название своего проекта/приложения, но только на латинице/английскими буквами. В данном случае мы написали краткое слово: Kota.

Параметр Minimum SDK, в данном случае, трогать не нужно.

Параметр Package name, тоже не нужно трогать, т.к он автоматически подстроится под написанное вами имя в пункте Name.

Параметр Save location, показывает и решает, где будет храниться ваш проект/приложения со всеми его файлами.

Далее нажимаем кнопку Finish.

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл


3. Открываем файл MainActivity.java, найдя его в каталоге проекта в папке java и в её подпапке com.example.

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл


Оставляем только строку:

package com.example.kota;

В вашем случае, вместо слова kota, в конце строки будет название вашего проекта!

Остальное содержимое ниже этой строки надо убрать и вместо этого под строкой:

package com.example.kota;

Надо разместить следующий код, чтобы получилось в итоге как на скриншоте выше:

import android.webkit.WebView;
//import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import androidx.appcompat.app.AppCompatActivity;
public class MainActivity extends AppCompatActivity {
protected WebView myWeb;
@override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
/* Находим наш браузер */
myWeb= (WebView) findViewById(R.id.webView);
/* Настраиваем наш браузер */
myWeb.getSettings().setUseWideViewPort(true);
myWeb.setInitialScale(1);
myWeb.getSettings().setJavaScriptEnabled(true);
/* Загружаем страничку */
myWeb.loadUrl("file:///android_asset/index.html");
}
}

Справочное пояснение (можно пропустить):

Чтобы объявить объект класса WebView, выполняются действия:
1. К списку импортов import дописывается:

import android.webkit.WebView;

2. Объявляется объект myWeb внутри класса MainActivity:

protected WebView myWeb;

Строка:

//import android.support.v7.app.AppCompatActivity;

В данном случае имеет вначале символы  //, т.к в данном языке и в данной версии программы, можно обойтись без этой строки, она здесь лишняя.

Символы //, отключают эту строку, по факту превращая ее из кода в текстовый комментарий, чтобы активировать строку кода, достаточно убрать символы //.


4. Откройте файл AndroidManifest.xml, расположенный в папке AndroidManifest.xml.

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл


Далее:

Первый вариант

Допишите сразу под определением «application» следующую строку:

android:hardwareAccelerated="true"

Второй вариант

Выделяем весь код в файле AndroidManifest.xml и вставляем вместо него следующий код, чтобы получилось примерно как на скриншоте выше:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.kota">
<application
android:hardwareAccelerated="true"
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@STYLE/Theme.Kota">
<activity
android:name=".MainActivity"
android:exported="true">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>

Но надо учесть, что в вашем случае, вместо слова kota в некоторых фрагментах кода, должно быть слово/название, вашего проекта, которое ему вы дали.

Вот эти фрагменты кода, содержащие название проекта (на скриншоте выше они выделены в прямоугольник):

package="com.example.kota">
и
android:theme="@STYLE/Theme.Kota">

(здесь название проекта должно быть с большой буквы, потому написано Kota, а не kota).


5. Откройте файл activity_main.xml, расположенный в каталоге: reslayout

Выбираем режим Code (Код) вместо режима Design (графический вид приложения), кнопки находятся в правой части интерфейса приложения AndroidStudio.

Удаляете весь код и вставляете следующий код:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="fill_parent"
android:layout_height="fill_parent"
tools:context=".MainActivity">
<WebView
android:id="@+id/webView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:clickable="true"
android:scrollbars="none" />
</RelativeLayout>


6. В главном меню File выбираем: New - Folder - Assets folder.

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл


Далее, ничего вообще не изменяя и не трогая, просто нажимаем кнопку Finish.

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл


7. В каталоге app найдите папку assets. Кликните по ней правой кнопкой мыши, и в появившемся меню выберите пункт -  Open in, а в подменю выберите пункт - Explorer.

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл

Откроется проводник WIndows, открыв ту самую папку assets, в которую нужно положить файлы вашего html-сайта или веб-страницы.

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл


8. Теперь можно запустить приложение, выбрав в главном меню Run - Run app или нажав сочетание клавиш Shift + F10, ваша html-страница или html-сайт, откроется на весь экран эмулятора смартфона.


9. Сборка Андроид-приложения и подпись Андроид-приложения в Android Studio.

В главном меню выбираем Build - Generate Signed APK.

Откроется окно с заголовком Generate Signed Bundle APK.

Далее нажмите «Create New».

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл


Откроется окно-форма New Key Store.

Первое поле Key Store Patch, это путь к папке, в которой будет сохранен ключ.

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл


При нажатии на значок папки в поле поле Key Store Patch, выйдет форма с заголовком Choose keystore file, где выбираем папку для сохранения ключа и имя для файла ключа.

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл


Нажав на кнопку ОК, вы снова попадете в окно Key Store Patch и здесь надо заполнить остальные поля. Пример заполнения, показан на скриншоте ниже.

Обозначения:

  • Alias - Псевдоним
  • Password - Пароль, который должен состоять из не менее шести символов
  • Confirm - Подтвердить пароль, введя ранее указанный пароль
  • First and Last Name - Имя и фамилия
  • Organizational Unit - Организационное подразделение
  • Organizaion - Организация
  • State or Province - Штат или Провинция

После заполнения полей, нажимаем на кнопку ОК.

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл


Поле этого, снова откроется окно с заголовком Generate Signed Bundle or APK, где ряд полей будет уже заполнен. Нажимаем здесь кнопку: Next.

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл


Появится окно с заголовком Generate Signed Bundle or APK, где надо заполнить два поля:

Destination folder - папка, куда будет сохранено собранное APK - приложение.
Build Variants - (Варианты сборки), где надо выбрать вариант Release (релиз, выпуск).


Далее, нажимаем кнопку Finish.

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл


Затем, вы можете наблюдать полосу состояния сборки приложения - Gradle Build Running, в нижнем правом углу программы Android Studio.

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл


Когда процесс сборки закончится, в этом же нижнем правом углу появится всплывающее сообщение с заголовком Generate Signed APK содержащее текст:

APK(s) generated successfully for module 'Kota.app' with 1 build variant:...

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл


Кликаем по этому сообщению, чтобы развернуть его и нажимаем на слово locate, чтобы открылась папка с созданным apk-файлом андроид-приложения.

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл


Если всплывающее сообщение со словом locate исчезло, то можно нажать на фразу - Event Log, которая находится тоже в нижнем правом углу, и тогда откроется лог-список с нужным вам словом locate.

Создание Android приложения без навыков программирования. Преобразование html страницы в apk файл


Данный apk-файл можно скопировать на смартфон и открыв его - запустить установку вашего собранного приложения на смартфон.


Pikabu.ru/@Agmioli

Developer.android.com/studio
Windows 7/8/10/11 (32/64-bit)
Размер 913 Мб


Оставить комментарий

Принять
Мы используем файлы cookie для улучшения работы сайта. Прочитать и убрать cookie script