Android webview using html+jquery inside app hangs sometimes - java

i had made html+jquery mobile app using webview , my all code is inside assest folder, i noticed sometime my app hangs and sometime it works fine ,if i am missing some thing
below is android java code
i made html +jquery app , app hangs most of time , and some time it works any way to make it work fine
below problem:
1: some time object in canvas gets duplicated however there is not changes of getting duplicate object on any of canvas this problem occurs only in android browser
2: sometime while dragging object gets stuck any where without being dropped in canvas only in android browser
below is my java code for that
public class MainActivity extends Activity implements OnClickListener {
private static final String URL = "file:///android_asset/index.html";
private WebView mWebView;
#SuppressLint("SetJavaScriptEnabled")
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mWebView = (WebView) findViewById(R.id.webview);
mWebView.getSettings().setJavaScriptEnabled(true);
mWebView.setWebChromeClient(new WebChromeClient());
mWebView.setWebViewClient(new WebViewClient(){
});
refreshWebView();
}
private void refreshWebView() {
mWebView.loadUrl(URL);
}
#Override
public void onClick(View v) {
refreshWebView();
}
}
and html code that i am using inside assest folde is below link
http://liveweave.com/JckSgC

I faced this bug before 6 months ago. After a lot lot of research on this topic I personally concluded that Its a API bug of android which was fixed in API level 18(KITKAT).
It means, "If the application is working on an android version less than Kitkat, webview starts hanging or works madly"
Reason:
WebView's of android version less than KITKAT doesn't support HTML5 and CSS3.
http://www.mobilexweb.com/blog/android-4-4-kitkat-browser-chrome-webview
Suggestions:
You can use external webviews like "ChromiumWebView"
(Link of ChromiumWebView https://github.com/pwnall/chromeview )
Or you can restrict your application to only runs on android version greater than or equivalent to KITKAT. (I personally doesn't prefer this)

Related

How can I apply the QR Code scanner to my webview application and then put the QR Code in the Google search engine, for example

How can I apply the QR Code scanner to my Webview application in android studio and then put the QRCode in the Google search engine, for example, the application now puts the QR Code in the result box. Please help me.
public class MainActivity extends AppCompatActivity {
Button btn_scan;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
btn_scan = findViewById(R.id.btn_scan);
btn_scan.setOnClickListener(v -> {
scanCode();
});
}
private void scanCode() {
ScanOptions options = new ScanOptions();
options.setPrompt("Volume up to flash on");
options.setBeepEnabled(true);
options.setOrientationLocked(true);
options.setCaptureActivity(CaptureAct.class);
barlaucher.launch(options);
}
ActivityResultLauncher<ScanOptions> barlaucher = registerForActivityResult(new ScanContract(), result -> {
if (result.getContents() != null) {
AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
builder.setTitle("Result");
builder.setMessage(result.getContents());
builder.setPositiveButton("ok", new DialogInterface.OnClickListener() {
#Override
public void onClick(DialogInterface dialogInterface, int i) {
dialogInterface.dismiss();
}
}).show();
}
});
}
It might help us to approach this problem in phases.
Tasks
Set up QR Code 'grabber'.
Set up grabbed QR Code 'parser'.
Set up WebView component initialized to load 'google.com' in stable efficient manner.
Set up basic JS interop for DOM manipulation. Best to use native Android API for JS interop. Every time we're just making one simple pass from App to WebView anyway, aka the representation of the QR Code.
Make sure QR Code 'parsed' data is converted to HTML friendly string.
In the meantime, we just load up google and inspect the seachbox and search button DOM element vars for the Google main page. This is not really app related.
We target these DOM element vars, set the search box text to final converted parsed data, activate the search submit button via JS and we should be more or less on the right path.
Personally, I'd possibly just load the QR Code stuff directly so it gets handled fairly proper by native WebView framework. This will mitigate well for general situations. But any time we allow end-users to interact with DOM like that we are inviting exponential JS havoc. To be honest this would be a rather alarming feature to have on an official app.

Android O device blank screen after addView / setContentview

I recently decided to update my older apps and bring them a little more up to date. In doing so I noticed an odd problem when running them on my new handset (Android O / API Level 29).
My App is essentially a single Activity using OpenGL. This is basically what happens when the app is first loaded...
Create Layout, Create a Splashscreen View, create custom GLSurfaceView
Add GLSurfaceView to Layout
Add Splashscreen to Layout
Start AsyncTask to load resources and do setup ops
GLSurfaceView dismisses Splashscreen to reveal renderer...
So, it all works perfectly well on my older devices (3 x handsets, 1 x tablet all running various versions of Android no higher than Lollipop).
However, on my Android 10 handset, all I get is a blank screen while the app starts. Just to be clear, there are no errors, the app itself works perfectly fine. After the usual startup time, the blank screen is dismissed and the app continues, it's just that the 'splashscreen' has now become a "blankscreen".
But Android Studio Layout Inspector tells a different story
Indeed, if I open the Layout Inspector in Android Studio, oddly it shows exactly what I would expect... the splashscreen with its text/graphics, but not on the actual device...
Some test code
In the following test code I replaced the resource loading / setup with a simple Thread.sleep just to create a longer delay so I could more easily inspect the output in Android Studio. This does still exhibit the problem...
#Override
protected void onCreate(Bundle savedInstanceState) {
int[] deviceResolution = getDeviceResolution();
width = deviceResolution[0];
height = deviceResolution[1];
layout = new RelativeLayout(this);
splash = new Splash(getApplication(), width, height);
myGLView = new CustomGLSurfaceView(this.getApplication());
layout.addView(myGLView);
layout.addView(splash);
setContentView(layout);
loadResource = new LoadResources(newBundle);
loadResources.execute();
super.onCreate(savedInstanceState);
}
class LoadResources AsyncTask<Void, Void, Void> {
Bundle savedBundle;
LoadResources(Bundle savedBundle){
this.savedBundle=savedBundle;
}
#Override
protected void onPreExecute() {
super.onPreExecute();
}
#Override
protected Void doInBackground(Void... params) {
// Simulate some long-running task here. While this is happening, splashscreen should be visible. And on older devices, it is. Not on Android O handset (but OK in Android Studio Layout Inspector).
try {
Thread.sleep(30000);
} catch (InterruptedException e) {
e.printStackTrace();
}
// Would typically make my calls here to load resources, and complete other setup tasks here
return null;
}
#Override
protected void onPostExecute(Void result) {
super.onPostExecute(result);
}
}
** Other observations **
I know that Async is now deprecated and I'm also aware of other Splashscreen tecnhiques such as using a dedicated Activity. However due to the setup/complexity of the apps and given that it doesn't 'break' them per-se, I don't want to have to refactor the entire codebase (just yet anyway) any new apps going forward will use a different system for the splashscreen. What I'm really trying to understand here is why this now doesn't work as it used to. Is this a bug? Or a behavioural change that happened in an Android version somewhere down the line? Or maybe it's just me doing something wrong. If anyone has come across it, I'd be really interested to know of a fix/workaround.
** Other things I've tried **
In the above example, if I simply don't add 'myGLView' then the splashscreen shows, but of course the app then won't work. So I though about adding it in onPostExecute and then bringing the splashscreen view back to the front with splash.bringToFront(). This kind of works, but is messy. The splashscreen only shows for a brief second, and on devices that show it correctly there is a 'glitch' as the correctly displayed splashscreen is overlayed with the GL Renderer and then bought back to the front.
You are adding a view to an object which is not currently set in an Activity.
The better approach would be calling setContentView() first as well as the super method, then adding the multiple views in it.
So in your case, it'll be like:
super.onCreate(savedInstanceState);
setContentView(layout);
layout = new RelativeLayout(this);
int[] deviceResolution = getDeviceResolution();
width = deviceResolution[0];
height = deviceResolution[1];
layout = new RelativeLayout(this);
splash = new Splash(getApplication(), width, height);
myGLView = new CustomGLSurfaceView(this.getApplication());
layout.addView(myGLView);
layout.addView(splash);
loadResource = new LoadResources(newBundle);
loadResources.execute();

Incorporating Two Angular Projects in One Ionic 4 App

I have a requirement to run 2 different angular projects in 1 Ionic App. The main reason for this is because they will serve as 2 different parts of the App and the second part of the app will be triggered by an android service, so I won't know from Angular side that it was triggered by the service.
By default, the normal "index.html" will be launched if the app starts, but I have incorporated an android service into the project which will in turn will Launch a JAVA class which will load another html file.
By Default:
public class MainActivity extends CordovaActivity
{
#Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
// enable Cordova apps to be started in the background
Bundle extras = getIntent().getExtras();
if (extras != null && extras.getBoolean("cdvStartInBackground", false))
{
moveTaskToBack(true);
}
// Set by <content src="index.html" /> in config.xml
loadUrl(launchUrl);
}
}
When Service is triggered:
public class ServiceTrigger extends CordovaActivity
{
#Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
// enable Cordova apps to be started in the background
Bundle extras = getIntent().getExtras();
if (extras != null && extras.getBoolean("cdvStartInBackground", false)) {
moveTaskToBack(true);
}
loadUrl("file:///android_asset/www/second_part.html");
}
}
I have created an additional Ionic App which I use to build the "Second_Part" of the app. I use the www content of this part of the app, and copy it over to the www directory of the Main App. I found that the "second_part.html" loads fine, but the issue comes while bootstrapping the "Second_Part" App. Once "second_part.html" loaded, the screen is just white, but when I just add plain HTML to "second_part.html", then it displays the HTML. I have also debugged via Android Studio but couldn't see errors.
Not sure if this is even possible, nor if anyone has ever attempted this. Can someone please tell me what I am doing wrong or if there is an alternative to pass parameters to the Main Part of the app to tell it that it was triggered by the Android Service?
Much Appreciated.
I found that I need to specify the full path for all css and js files:
<script type="text/javascript" src="./android_asset/www/app2/runtime.js"></script>
instead of
<script type="text/javascript" src="runtime.js"></script>
After I changed the paths, everything worked perfect!
With this said, I moved the entire second part of the app to it's own folder inside the www directory, thus I also had to change the url Cordova has to load:
loadUrl("file:///android_asset/www/app2/index.html");
This is just a cleaned approach and will work well with Code Push.

Android development noob: WebView usage

I've been following this series of Android Development Tutorials and I've encountered some problem trying to tweak one of the projects I've created.
Basically all I want to know is how to apply the WebView correctly in my project - in the easiest and most simple way possible.
What I've done:
enabled permission to the internet on the manifest
created the webview on the main_activity.xml
imported the WebView webkit to my MainActivity Java class
And all I've done after that is simply loading the url on my onCreated method like this:
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
WebView v = (WebView) findViewById(R.id.weblol);
v.loadUrl("www.google.com");
}
However nothing seems to happen and the block of the WebView remains blank white
Care to explain to a noob what am I doing wrong ?
You should use http://www.google.com instead of www.google.com.
Only you to this,webview can notice this it is a URL.
Otherwise.you can use local file in webview ,like file:///android_asset/xxx in assets folder.
That's all.

Always show zoom controls in WebView

Is there any way to always show zoom controls in webview?
I found this: Always show zoom controls on a MapView
but that's for the mapview.
I want them to always be visible.
super.onCreate(savedInstanceState);
super.loadUrl("file:///android_asset/www/index.html");
WebSettings ws = super.appView.getSettings();
ws.setSupportZoom(true);
ws.setBuiltInZoomControls(true);
setDisplayZoomControls() is only available from API 11 (Android 3). So you can't even consider using it until the vast majority of Android devices are 3 or above - which will not be for some years :(
Not sure if this will work as I never tried, but I checked the reference in developer.android.com
ws.setDisplayZoomControls(true);
If this worked dont forget to best answer this answer.
Also check this out:
http://www.tutorialforandroid.com/2009/02/webview-with-zoomcontrols-in-android.html
good tutorial. (Debunks my theory)
None of the above worked for my. Only when I start draging the webview content the controls show up the first time. So what I did as a "quick fix" is in onStart() of my Fragment that holds the Dialog with the webview I call:
webview.invokeZoomPicker();
Example:
#Override
public void onStart(){
super.onStart();
DialogFragment dialog = this;
//...stuff
if(dialog.getDialog()!= null && dialog.getDialog().getWindow()!=null){
//...more stuff
View v = dialog.getView();
if(v!=null){
//invoke controls on start once, they stay active a few seconds:
WebView webview =v.findViewById(R.id.frag_dlg_WebView);
webview.invokeZoomPicker();
}
}
}
The controls light up only for a few seconds until they disappear again, by then the user in my case should have dragged the webview already.

Categories

Resources