This is an automated email from the ASF dual-hosted git repository.
github-bot pushed a commit to branch asf-site
in repository https://gitbox.apache.org/repos/asf/cordova-docs.git
The following commit(s) were added to refs/heads/asf-site by this push:
new 6b741a274e Deploying to asf-site from @
apache/cordova-docs@749f516289b374b9709a90933f0fcf46274ccac7 🚀
6b741a274e is described below
commit 6b741a274ee215c6add53ddeb3985f4487894621
Author: erisu <er...@users.noreply.github.com>
AuthorDate: Mon Jul 14 02:31:48 2025 +0000
Deploying to asf-site from @
apache/cordova-docs@749f516289b374b9709a90933f0fcf46274ccac7 🚀
---
docs/en/dev/guide/platforms/android/webview.html | 276 +++++++++++++++--------
feed.xml | 4 +-
2 files changed, 184 insertions(+), 96 deletions(-)
diff --git a/docs/en/dev/guide/platforms/android/webview.html
b/docs/en/dev/guide/platforms/android/webview.html
index 31867f6ce7..617d186e41 100644
--- a/docs/en/dev/guide/platforms/android/webview.html
+++ b/docs/en/dev/guide/platforms/android/webview.html
@@ -2379,120 +2379,208 @@ legacy <code>CordovaActivity</code> component that
pre-dates the 1.9 release.</p
<ol>
<li>
- <p>To follow these instructions, make sure you have the latest Cordova
-distribution. Download it from
-<a href="https://cordova.apache.org";>cordova.apache.org</a> and unzip its
-Android package.</p>
+ <p>Create a new or open an exisiting native application.</p>
</li>
<li>
- <p>Navigate to the Android package's <code>/framework</code> directory
and run
-<code>ant jar</code>. It creates the Cordova <code>.jar</code> file, formed as
-<code>/framework/cordova-x.x.x.jar</code>.</p>
- </li>
- <li>
- <p>Copy the <code>.jar</code> file into the Android project's
<code>/libs</code> directory.</p>
- </li>
- <li>
- <p>Add the following to the application's
<code>/res/xml/main.xml</code> file,
-with the <code>layout_height</code>, <code>layout_width</code> and
<code>id</code> modified to suit
-the application:</p>
-
- <div class="language-plaintext highlighter-rouge"><div
class="highlight"><pre class="highlight"><code>
<org.apache.cordova.CordovaWebView
- android:id="@+id/tutorialView"
- android:layout_width="match_parent"
- android:layout_height="match_parent" />
+ <p>Add the Cordova-Android framework dependency to your app module's
build configuration.</p>
+
+ <p>If your build configuration uses Groovy DSL, update
<code>app/build.gradle</code> with the following:</p>
+
+ <div class="language-groovy highlighter-rouge"><div class="highlight"><pre
class="highlight"><code> <span class="n">dependencies</span> <span
class="o">{</span>
+ <span class="n">implementation</span> <span
class="s1">'org.apache.cordova:framework:14.0.1'</span>
+ <span class="o">}</span>
</code></pre></div> </div>
+
+ <p>If your build configuration uses Kotlin DSL, update
<code>app/build.gradle.kts</code> with the following:</p>
+
+ <div class="language-kotlin highlighter-rouge"><div class="highlight"><pre
class="highlight"><code> <span class="nf">dependencies</span> <span
class="p">{</span>
+ <span class="nf">implementation</span><span class="p">(</span><span
class="s">"org.apache.cordova:framework:14.0.1"</span><span class="p">)</span>
+ <span class="p">}</span>
+</code></pre></div> </div>
+
+ <p>After making any changes to your build configuration file, make sure to
"<strong>Sync Project with Gradle Files</strong>" so it will checkout
the framework.</p>
+
+ <p><strong>Note:</strong> Your build configuration may already includes a
<code>dependencies</code> block, so simply add the <code>implementation</code>
line within the existing block.</p>
+
+ <p><strong>Note:</strong> You can find a list of available versions of
released Cordova-Android framework on <a
href="https://central.sonatype.com/artifact/org.apache.cordova/framework/versions";>Sonatype
Maven Central Repository</a> or any other mirror of the Maven Central
Repository.</p>
</li>
<li>
- <p>Modify the activity so that it implements the
<code>CordovaInterface</code>.
-It should implement the included methods. You may wish to copy
-them from <code>/framework/src/org/apache/cordova/CordovaActivity.java</code>,
-or else implement them on your own. The following code fragment
-shows a basic application that relies on the interface. Note how
-the referenced view id matches the <code>id</code> attribute specified in the
-XML fragment shown above:</p>
-
- <div class="language-plaintext highlighter-rouge"><div
class="highlight"><pre class="highlight"><code> public class
CordovaViewTestActivity extends Activity implements CordovaInterface {
- CordovaWebView cwv;
- /* Called when the activity is first created. */
- @Override
- public void onCreate(Bundle savedInstanceState) {
- super.onCreate(savedInstanceState);
- setContentView(R.layout.main);
- cwv = (CordovaWebView) findViewById(R.id.tutorialView);
- Config.init(this);
- cwv.loadUrl(Config.getStartUrl());
- }
+ <p>Modify the layout file of the activity that shall host the Cordova view
e.g.</p>
+
+ <div class="language-xml highlighter-rouge"><div class="highlight"><pre
class="highlight"><code><span class="cp"><?xml version="1.0"
encoding="utf-8"?></span>
+<span class="nt"><LinearLayout</span> <span
class="na">xmlns:android=</span><span
class="s">"http://schemas.android.com/apk/res/android";</span>
+ <span class="na">android:orientation=</span><span
class="s">"vertical"</span>
+ <span class="na">android:layout_width=</span><span
class="s">"match_parent"</span>
+ <span class="na">android:layout_height=</span><span
class="s">"match_parent"</span><span class="nt">></span>
+
+ <span class="nt"><org.apache.cordova.engine.SystemWebView</span>
+ <span class="na">android:id=</span><span
class="s">"@+id/cordovaWebView"</span>
+ <span class="na">android:layout_width=</span><span
class="s">"match_parent"</span>
+ <span class="na">android:layout_height=</span><span
class="s">"match_parent"</span> <span class="nt">/></span>
+<span class="nt"></LinearLayout></span>
</code></pre></div> </div>
</li>
<li>
- <p>If the application needs to use the camera, implement the
-following:</p>
-
- <div class="language-plaintext highlighter-rouge"><div
class="highlight"><pre class="highlight"><code> @Override
- public void setActivityResultCallback(CordovaPlugin plugin) {
- this.activityResultCallback = plugin;
- }
- /**
- * Launch an activity for which you would like a result when it finished.
When this activity exits,
- * your onActivityResult() method is called.
- *
- * @param command The command object
- * @param intent The intent to start
- * @param requestCode The request code that is passed to callback to
identify the activity
- */
- public void startActivityForResult(CordovaPlugin command, Intent intent, int
requestCode) {
- this.activityResultCallback = command;
- this.activityResultKeepRunning = this.keepRunning;
-
- // If multitasking turned on, then disable it for activities that return
results
- if (command != null) {
- this.keepRunning = false;
- }
-
- // Start activity
- super.startActivityForResult(intent, requestCode);
- }
-
- @Override
- /**
- * Called when an activity you launched exits, giving you the requestCode you
started it with,
- * the resultCode it returned, and any additional data from it.
- *
- * @param requestCode The request code originally supplied to
startActivityForResult(),
- * allowing you to identify who this result came
from.
- * @param resultCode The integer result code returned by the child
activity through its setResult().
- * @param data An Intent, which can return result data to the
caller (various data can be attached to Intent "extras").
- */
- protected void onActivityResult(int requestCode, int resultCode, Intent
intent) {
- super.onActivityResult(requestCode, resultCode, intent);
- CordovaPlugin callback = this.activityResultCallback;
- if (callback != null) {
- callback.onActivityResult(requestCode, resultCode, intent);
- }
- }
+ <p>Modify your activity to extend <code>CordovaActivity</code> and
override the <code>onCreate</code>, <code>makeWebView</code> and
<code>createViews</code> to use your defined layout:</p>
+
+ <p><strong>Kotlin Example:</strong></p>
+
+ <div class="language-kotlin highlighter-rouge"><div class="highlight"><pre
class="highlight"><code><span class="k">package</span> <span
class="nn">org.apache.cordova.testapp</span>
+
+<span class="k">import</span> <span class="nn">android.os.Bundle</span>
+<span class="k">import</span> <span class="nn">android.view.View</span>
+<span class="k">import</span> <span
class="nn">androidx.activity.enableEdgeToEdge</span>
+<span class="k">import</span> <span
class="nn">org.apache.cordova.CordovaActivity</span>
+<span class="k">import</span> <span
class="nn">org.apache.cordova.CordovaWebView</span>
+<span class="k">import</span> <span
class="nn">org.apache.cordova.CordovaWebViewImpl</span>
+<span class="k">import</span> <span
class="nn">org.apache.cordova.engine.SystemWebView</span>
+<span class="k">import</span> <span
class="nn">org.apache.cordova.engine.SystemWebViewEngine</span>
+
+<span class="kd">class</span> <span class="nc">TestActivity</span> <span
class="p">:</span> <span class="nc">CordovaActivity</span><span
class="p">()</span> <span class="p">{</span>
+ <span class="k">override</span> <span class="k">fun</span> <span
class="nf">onCreate</span><span class="p">(</span><span
class="n">savedInstanceState</span><span class="p">:</span> <span
class="nc">Bundle</span><span class="p">?)</span> <span class="p">{</span>
+ <span class="k">super</span><span class="p">.</span><span
class="nf">onCreate</span><span class="p">(</span><span
class="n">savedInstanceState</span><span class="p">)</span>
+ <span class="nf">enableEdgeToEdge</span><span class="p">()</span>
+ <span class="nf">setContentView</span><span class="p">(</span><span
class="nc">R</span><span class="p">.</span><span class="n">layout</span><span
class="p">.</span><span class="n">activity_test</span><span class="p">)</span>
+ <span class="p">}</span>
+
+ <span class="k">override</span> <span class="k">fun</span> <span
class="nf">makeWebView</span><span class="p">():</span> <span
class="nc">CordovaWebView</span> <span class="p">{</span>
+ <span class="kd">val</span> <span class="py">appView</span> <span
class="p">=</span> <span class="n">findViewById</span><span
class="p"><</span><span class="nc">View</span><span
class="p">>(</span><span class="nc">R</span><span class="p">.</span><span
class="n">id</span><span class="p">.</span><span
class="n">cordovaWebView</span><span class="p">)</span> <span
class="k">as</span> <span class="nc">SystemWebView</span>
+ <span class="k">return</span> <span
class="nc">CordovaWebViewImpl</span><span class="p">(</span><span
class="nc">SystemWebViewEngine</span><span class="p">(</span><span
class="n">appView</span><span class="p">))</span>
+ <span class="p">}</span>
+
+ <span class="k">override</span> <span class="k">fun</span> <span
class="nf">createViews</span><span class="p">()</span> <span class="p">{</span>
+ <span class="c1">// leave empty so the layout is used</span>
+ <span class="p">}</span>
+<span class="p">}</span>
+</code></pre></div> </div>
+
+ <p><strong>Java Example:</strong></p>
+
+ <div class="language-java highlighter-rouge"><div class="highlight"><pre
class="highlight"><code><span class="kn">package</span> <span
class="nn">org.apache.cordova.testapp</span><span class="o">;</span>
+
+<span class="kn">import</span> <span class="nn">android.os.Bundle</span><span
class="o">;</span>
+<span class="kn">import</span> <span class="nn">android.view.View</span><span
class="o">;</span>
+<span class="kn">import</span> <span
class="nn">androidx.activity.enableEdgeToEdge</span><span class="o">;</span>
+<span class="kn">import</span> <span
class="nn">org.apache.cordova.CordovaActivity</span><span class="o">;</span>
+<span class="kn">import</span> <span
class="nn">org.apache.cordova.CordovaWebView</span><span class="o">;</span>
+<span class="kn">import</span> <span
class="nn">org.apache.cordova.CordovaWebViewImpl</span><span class="o">;</span>
+<span class="kn">import</span> <span
class="nn">org.apache.cordova.engine.SystemWebView</span><span
class="o">;</span>
+<span class="kn">import</span> <span
class="nn">org.apache.cordova.engine.SystemWebViewEngine</span><span
class="o">;</span>
+
+<span class="kd">public</span> <span class="kd">class</span> <span
class="nc">TestActivity</span> <span class="kd">extends</span> <span
class="nc">CordovaActivity</span> <span class="o">{</span>
+ <span class="nd">@Override</span>
+ <span class="kd">public</span> <span class="kt">void</span> <span
class="nf">onCreate</span><span class="o">(</span><span
class="nc">Bundle</span> <span class="n">savedInstanceState</span><span
class="o">)</span> <span class="o">{</span>
+ <span class="kd">super</span><span class="o">.</span><span
class="na">onCreate</span><span class="o">(</span><span
class="n">savedInstanceState</span><span class="o">);</span>
+ <span class="n">setContentView</span><span class="o">(</span><span
class="no">R</span><span class="o">.</span><span class="na">layout</span><span
class="o">.</span><span class="na">activity_test</span><span
class="o">);</span> <span class="c1">// layout file for your activity</span>
+ <span class="kd">super</span><span class="o">.</span><span
class="na">init</span><span class="o">();</span>
+ <span class="n">loadUrl</span><span class="o">(</span><span
class="n">launchUrl</span><span class="o">);</span>
+ <span class="o">}</span>
+
+ <span class="nd">@Override</span>
+ <span class="kd">protected</span> <span class="nc">CordovaWebView</span>
<span class="nf">makeWebView</span><span class="o">()</span> <span
class="o">{</span>
+ <span class="nc">SystemWebView</span> <span class="n">appView</span>
<span class="o">=</span> <span class="o">(</span><span
class="nc">SystemWebView</span><span class="o">)</span> <span
class="n">findViewById</span><span class="o">(</span><span
class="no">R</span><span class="o">.</span><span class="na">id</span><span
class="o">.</span><span class="na">cordovaWebView</span><span
class="o">);</span> <span class="c1">// id for the SystemWebView in previous
step</span>
+ <span class="k">return</span> <span class="k">new</span> <span
class="nf">CordovaWebViewImpl</span><span class="o">(</span><span
class="k">new</span> <span class="nc">SystemWebViewEngine</span><span
class="o">(</span><span class="n">appView</span><span class="o">));</span>
+ <span class="o">}</span>
+
+ <span class="nd">@Override</span>
+ <span class="kd">protected</span> <span class="kt">void</span> <span
class="nf">createViews</span><span class="o">()</span> <span class="o">{</span>
+ <span class="c1">// leave empty so the layout is used</span>
+ <span class="o">}</span>
+<span class="o">}</span>
</code></pre></div> </div>
</li>
<li>
- <p>Finally, remember to add the thread pool, otherwise plugins
-have no threads on which to run:</p>
+ <p>Setup up the theming for your activity to comply with Cordova.</p>
+
+ <p>As Cordova-Android framework displays a SplashScreen, we will need to
update the native app's <code>themes.xml</code> to include a SplashScreen
theme and <code>postSplashScreenTheme</code> for our Cordova activity.</p>
- <div class="language-plaintext highlighter-rouge"><div
class="highlight"><pre class="highlight"><code> @Override
- public ExecutorService getThreadPool() {
- return threadPool;
- }
+ <p><strong>Note:</strong> Since <code>CordovaActivity</code> extends
<code>AppCompatActivity</code>, the <code>postSplashScreenTheme</code> that the
activity will transition to must inherit from a <code>Theme.AppCompat.*</code>
style. For example, you can use
<code>Theme.AppCompat.DayNight.NoActionBar</code> or a custom theme based on
it.</p>
+
+ <p>Below is an example and the theme names can be changed to your perfered
naming.</p>
+
+ <div class="language-xml highlighter-rouge"><div class="highlight"><pre
class="highlight"><code> <span class="cp"><?xml version="1.0"
encoding="utf-8"?></span>
+ <span class="nt"><resources</span> <span
class="na">xmlns:tools=</span><span
class="s">"http://schemas.android.com/tools";</span><span class="nt">></span>
+ <span class="c"><!-- The theme that will be used for the activity that
displays Cordova --></span>
+ <span class="nt"><style</span> <span class="na">name=</span><span
class="s">"Theme.MyCordovaAppSplashScreen"</span> <span
class="na">parent=</span><span
class="s">"Theme.SplashScreen.IconBackground"</span><span class="nt">></span>
+ <span class="nt"><item</span> <span class="na">name=</span><span
class="s">"windowSplashScreenBackground"</span><span
class="nt">></span>@color/black<span class="nt"></item></span>
+ <span class="nt"><item</span> <span class="na">name=</span><span
class="s">"windowSplashScreenAnimatedIcon"</span><span
class="nt">></span>@drawable/ic_launcher_foreground<span
class="nt"></item></span>
+ <span class="nt"><item</span> <span class="na">name=</span><span
class="s">"windowSplashScreenAnimationDuration"</span><span
class="nt">></span>200<span class="nt"></item></span>
+ <span class="nt"><item</span> <span class="na">name=</span><span
class="s">"postSplashScreenTheme"</span><span
class="nt">></span>@style/Theme.MyCordovaApp<span
class="nt"></item></span>
+ <span class="nt"></style></span>
+
+ <span class="c"><!-- The Post SplashScreen Theme --></span>
+ <span class="nt"><style</span> <span class="na">name=</span><span
class="s">"Theme.MyCordovaApp"</span> <span class="na">parent=</span><span
class="s">"Theme.AppCompat.DayNight.NoActionBar"</span> <span
class="nt">/></span>
+ <span class="nt"></resources></span>
</code></pre></div> </div>
+ <p>Next, update the <code>android:theme</code> attribute for your Cordova
<code><activity></code> to
<code>@style/Theme.MyCordovaAppSplashScreen</code> .</p>
</li>
<li>
- <p>Copy the application's HTML and JavaScript files to the Android
-project's <code>/assets/www</code> directory.</p>
+ <p>Copy your application's web assets (HTML, CSS, JavaScript) to the
Android project's
<code><app-root-directory>/app/src/main/assets/www/</code> directory.</p>
</li>
<li>
- <p>Copy the <code>config.xml</code> file from
<code>/framework/res/xml</code> to the
-project's <code>/res/xml</code> directory.</p>
+ <p>Copy your <code>config.xml</code> file to your Android project's
<code><app-root-directory>/app/src/main/res/xml/</code> directory.</p>
</li>
</ol>
+<h2>Bonus: Jetpack Compose</h2>
+
+<p>If your native Android application uses Jetpack Compose instead of XML
layouts, you can still integrate the Cordova WebView by writing your Activity
like this:</p>
+
+<div class="language-kotlin highlighter-rouge"><div class="highlight"><pre
class="highlight"><code><span class="k">package</span> <span
class="nn">org.apache.cordova.testapp</span>
+
+<span class="k">import</span> <span class="nn">android.os.Bundle</span>
+<span class="k">import</span> <span
class="nn">androidx.activity.compose.setContent</span>
+<span class="k">import</span> <span
class="nn">androidx.activity.enableEdgeToEdge</span>
+<span class="k">import</span> <span
class="nn">androidx.compose.foundation.layout.fillMaxSize</span>
+<span class="k">import</span> <span
class="nn">androidx.compose.runtime.Composable</span>
+<span class="k">import</span> <span
class="nn">androidx.compose.ui.Modifier</span>
+<span class="k">import</span> <span
class="nn">androidx.compose.ui.viewinterop.AndroidView</span>
+<span class="k">import</span> <span
class="nn">org.apache.cordova.testapp.ui.theme.TestAppTheme</span>
+<span class="k">import</span> <span
class="nn">org.apache.cordova.CordovaActivity</span>
+<span class="k">import</span> <span
class="nn">org.apache.cordova.CordovaWebView</span>
+<span class="k">import</span> <span
class="nn">org.apache.cordova.CordovaWebViewImpl</span>
+<span class="k">import</span> <span
class="nn">org.apache.cordova.engine.SystemWebView</span>
+<span class="k">import</span> <span
class="nn">org.apache.cordova.engine.SystemWebViewEngine</span>
+
+<span class="kd">class</span> <span class="nc">TestActivity</span> <span
class="p">:</span> <span class="nc">CordovaActivity</span><span
class="p">()</span> <span class="p">{</span>
+ <span class="k">private</span> <span class="k">lateinit</span> <span
class="kd">var</span> <span class="py">cordovaWebView</span><span
class="p">:</span> <span class="nc">CordovaWebView</span>
+
+ <span class="k">override</span> <span class="k">fun</span> <span
class="nf">onCreate</span><span class="p">(</span><span
class="n">savedInstanceState</span><span class="p">:</span> <span
class="nc">Bundle</span><span class="p">?)</span> <span class="p">{</span>
+ <span class="k">super</span><span class="p">.</span><span
class="nf">onCreate</span><span class="p">(</span><span
class="n">savedInstanceState</span><span class="p">)</span>
+ <span class="nf">enableEdgeToEdge</span><span class="p">()</span>
+
+ <span class="c1">// Set up the Cordova WebView manually</span>
+ <span class="kd">val</span> <span class="py">systemWebView</span>
<span class="p">=</span> <span class="nc">SystemWebView</span><span
class="p">(</span><span class="k">this</span><span class="p">)</span>
+ <span class="n">cordovaWebView</span> <span class="p">=</span> <span
class="nc">CordovaWebViewImpl</span><span class="p">(</span><span
class="nc">SystemWebViewEngine</span><span class="p">(</span><span
class="n">systemWebView</span><span class="p">))</span>
+
+ <span class="nf">setContent</span> <span class="p">{</span>
+ <span class="c1">// Make sure to change "TestAppTheme" with your
app's custom Jetpack Compose theme function.</span>
+ <span class="nc">TestAppTheme</span> <span class="p">{</span>
+ <span class="nc">CordovaWebViewContainer</span><span
class="p">(</span><span class="n">systemWebView</span> <span class="p">=</span>
<span class="n">systemWebView</span><span class="p">)</span>
+ <span class="p">}</span>
+ <span class="p">}</span>
+
+ <span class="nf">loadUrl</span><span class="p">(</span><span
class="n">launchUrl</span><span class="p">)</span>
+ <span class="p">}</span>
+
+ <span class="k">override</span> <span class="k">fun</span> <span
class="nf">makeWebView</span><span class="p">():</span> <span
class="nc">CordovaWebView</span> <span class="p">{</span>
+ <span class="k">return</span> <span class="n">cordovaWebView</span>
+ <span class="p">}</span>
+
+ <span class="k">override</span> <span class="k">fun</span> <span
class="nf">createViews</span><span class="p">()</span> <span class="p">{</span>
+ <span class="c1">// leave empty so the layout is used</span>
+ <span class="p">}</span>
+<span class="p">}</span>
+
+<span class="nd">@Composable</span>
+<span class="k">fun</span> <span
class="nf">CordovaWebViewContainer</span><span class="p">(</span><span
class="n">systemWebView</span><span class="p">:</span> <span
class="nc">SystemWebView</span><span class="p">)</span> <span class="p">{</span>
+ <span class="nc">AndroidView</span><span class="p">(</span>
+ <span class="n">factory</span> <span class="p">=</span> <span
class="p">{</span> <span class="n">systemWebView</span> <span
class="p">},</span>
+ <span class="n">modifier</span> <span class="p">=</span> <span
class="nc">Modifier</span><span class="p">.</span><span
class="nf">fillMaxSize</span><span class="p">()</span>
+ <span class="p">)</span>
+<span class="p">}</span>
+</code></pre></div></div>
+
</div>
</div>
diff --git a/feed.xml b/feed.xml
index de50c9e724..94f44450ff 100644
--- a/feed.xml
+++ b/feed.xml
@@ -6,8 +6,8 @@
</description>
<link>https://cordova.apache.org/</link>
<atom:link href="https://cordova.apache.org/feed.xml"; rel="self"
type="application/rss+xml"/>
- <pubDate>Mon, 14 Jul 2025 02:24:16 +0000</pubDate>
- <lastBuildDate>Mon, 14 Jul 2025 02:24:16 +0000</lastBuildDate>
+ <pubDate>Mon, 14 Jul 2025 02:30:48 +0000</pubDate>
+ <lastBuildDate>Mon, 14 Jul 2025 02:30:48 +0000</lastBuildDate>
<generator>Jekyll v4.4.1</generator>
<item>
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscr...@cordova.apache.org
For additional commands, e-mail: commits-h...@cordova.apache.org
