HTMLControl on WM 6.1 - VGA - html

I am facing trouble enabling "High Resolution" mode in WM6
Professional. I am using a HTMLView.dll to embed an HTMLControl in our
application. By default the "HTML" Shown is not in "High Resolution"
Mode - The App is appearing all zoomed up and as how it is displayed
in lesser resolution Emulators/devices.(QVGA)
I have already referred to a few links suggested from folks. Most of
the links point to https://learn.microsoft.com/en-us/previous-versions/aa454895(v=msdn.10)
which offers a solution to turn off the Emulation layer in WM6 by
adding a line to the resource file.
HI_RES_AWARE CEUX {1} // To turn off the emulation layer
This is because of an accepted bug - discussed at -
https://social.msdn.microsoft.com/Forums/en-US/4d3c837d-16f4-4ae4-acc2-96bb8d573111/htmlview-too-large-on-wm6-vga
Doing the HI_RES_AWARE didn't help as the view on the HTMLControl was
the same. I want to imitate the same functionality that IE Mobile does
when I select Menu->View->High Resolution, which does show the HTML
the way it's supposed to be shown (Smaller - so that more HTML View
screen is achieved).
I have already tried to modify the DTM_ZOOMLEVEL which I normally set
when an HTML is written to the HTMLControl - But even the least zoom
setting doesn't zoom out sufficiently. The view on the IE mobile's high
resolution mode is much better.
I have also tried getting the width and height of the screen by using
the GetDeviceCaps() method, but this only returns me the screen size,
which will at the max help me to modify my created window's size.
The issue that I am facing is how to enable the high resolution mode
automatically on my html pages (here I am not creating the UI for
mobile device, it's only the html page).
Any pointers?

I've researched a lot and from the resources and my experience. You're stuck with a QVGA resolution for the HTML Control on WM 6.1 - it's like hardcoded from Microsoft.
No point in dragging your quest forward. End it and re-design your UI to look good on QVGA resolution.

Related

Web pages in CHtmlView with high dpi (150%) display incorrectly

Problem
I'm having the problem for days and haven't found anyone else mentioned it..
The issue is that when I set the system dpi scaling to 150% or above, some webpages I open in CHtmlView would be messed up, while using IE or Chrome not causing the same problem.
Context
It seems like in CHtmlView the fonts get bigger than it's needed. I figured out this situation happens if my program's "high DPI-aware" property is set. But I can't turn it off either because the webpage would be blurry.
The strange part is when I tested msdn or google paged in CHtmlView, they neither caused the problem nor scale 150%. They just displayed as the 100% one.
Not sure if I should do something to my program or the webpage. The webpage needed to be displayed in my program is also from my company, so if I know what to set in the webpage I could handle it.
Thank you :)
Edit:
Because the website I'm having problem with is a private site, so I use another page to explain the situation.
Webpage in HtmlView, seem like only fonts get bigger.
Webpage in IE
I'm here as I've got the same problem.
You can create a new VS2017 MFC project, derive a view from CHtmlView, you'll find this in the constructed code
void CMFCApplication4View::OnInitialUpdate()
{
CHtmlView::OnInitialUpdate();
Navigate2(_T("http://www.msdn.microsoft.com/visualc/"),nullptr, nullptr);
}
(Note I had to delete the two trailing nullptr arguments to get it to compile)
My application manifest lists the app as being High DPI Aware and I've got a 200% (192dpi) scaled monitor.
The web page that loads is tiny (unscaled).
zett42's answer (Aug 31 '17 at 14:39) is correct. Add the registry key indicated, using
Computer\HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\Main\FeatureControl\FEATURE_BROWSER_EMULATION
MFCApplication4.exe=11001 [your application name here].
Restart the app, hey presto everythin is correctly scaled.
Dunno why I can't upvote zett42.

Cursor not showing in Device Mode (Google Chrome)

So I'm trying to develop a webapplication and I'm trying to check it out on mobile.
I'm currently using Cordova and JQuery Mobile together with ripple.js to view my application in my browser.
The first issue (as far as I know) is that ripple.js will work best in Google Chrome, so this is my only test platform.
The second issue is that when I toggle Device Mode on, it doesn't show me the black dot (cursor) when I enter the rendered version.
I'll explain my situation or a scenario:
As an example I'll go to http://google.com
I press F12 to enter developer mode
I click the Toggle Device Mode button
I will see my cursor, until I enter the generated mobile canvas. While I would normally see a black transparant dot, I now see nothing.
I can however click and drag like I would normally do, but I can't see what I'm doing.
The things I already tried:
Reset all the flags back to default
Reset all developer tool settings to default
(edit) Installed a previous version of Chrome AND Chromium
So question is, how do I get my cursor back?
Extra: I'm using version 49.0.2623.87 m, but that's not related since my co-worker, has the same version and he sees the cursor.
(edit) currently I'm using the mouse option where I press Ctrl to see the circle which indicates where my cursor is, but this really has to be a temp solution.
(edit) I fixed it by doing a combination of things. So I'm not sure which exact thing fixed it. I removed a few programs that I installed after it still worked. I uninstalled about 4 of them. Also I did an update of my graphics card and then did a reboot. So it could be either the graphics card update, the software uninstall and/or the reboot.
I had the same issue. (note this question might be a duplicate of this one)
Following the advice on the Chrome forum here I changed the Quantization Range in my Intel HD Graphics Control Panel from "Default Range" to "Full Range". The touch pointer (grey circle) appeared immediately.
If that doesn't help you may have to change refresh rate too. Changing from 59p Hz to 60p Hz or some other refresh rate might help.
This should also help.
Open the mouse control panel.
Select the Pointer Options tab in the Mouse Properties window.
Then enable Display pointer trails option.
In case you don't like or are getting annoyed, like me, due to the trailer. Move the slider to the Short position and the trailer becomes near to non-existent or invisible.
I fixed it myself, yet I'm not exactly sure how I did it. I edited my original post and added the solution in the last paragraph.
Had the same on my Asus laptop with Chrome 66
Resolution that worked for me
Graphics Control Panel > Display > General Settings > Scaling > Change to Scale full screen.
OFF your Asus Eye Care Switcher.
I am posting this as answer because above mentioned answer didn't work for me but I had this issue when I had a monitor attached to my laptop, for development work. I played around with my display settings and discovered that IF the scale on my second monitor did not match the scale on my laptop, the mobile development mode cursor would disappear. (windows 10)
If this is an issue for anyone just go into Display settings -> Display -> Scale and Layout --> make sure that both your laptop/desktop matches the display scale of your second monitor.
Hope this will help.

GXT Info.display not getting rendered properly on screen in IE8

I am using Info.display("", "My message");to display GXT Info box on screen but it is observed that the info box is not rendered properly (with a transparent background not readable properly) in some of user system.
This issue is solved when user clear browser cache and delete temp folder files and start a new session, but the problem is replicated again after some time interval.What could be the reason? I am not able to debug because Message div is deleted in a fraction of 3-4 seconds.I am using sencha 3.0 version.
Your problem sounds similar to the one described in this Sencha GTX 3.x bug report:
http://www.sencha.com/forum/showthread.php?282275-Info-popup-is-transparent-in-IE
You may wish to follow its progress if this issue is still important to you.

Google Chrome shows gray circle cursor

Google Chrome shows a gray circle cursor when dev tools is active. Why is this happening and how do I make this stop?
Nov 29th, 2017 Update:
Quick Update brought to you by #Howdy_McGee.
Chrome 62 you have to Add Device Type, there's no longer an option for Show Device Type.
Why is this happening?
As Randy Hall points out below "This cursor indicates a "touch", such as your finger, for emulating touch events in (the) Chrome browser."
July 20th, 2017 Update: (version 59.0.3071.115) Just checking in again, looks like the below is still valid even through a bunch of Chrome updates. They have changed the wording of Show device type to Add device type. I've changed the wording below, but the image does not reflect the change.
They have also changed the way the device type settings work, explained below.
Once in responsive mode (via F12, then ctrl + shift + m) you will need to select the settings section indicated by the 3 grey circles, then select Add device type. Once you do this, a new drop down will appear next to the dimensions area, select Mobile (no touch). I imagine they did this so that you don't have to keep it on desktop and adjust the user agent type to a mobile device as I've described below.
What do the Device Types mean?
As of today (July 20th, 2017), the same settings for device type exist (as shown in the image above), but they work a bit differently than previously before:
Mobile: Now scales the content on the page when resizing the window (to accurately simulate pixel density on a mobile device). The circle that replaces your mouse, simulates a screen touch action when clicking (full fledged mobile development / testing).
Mobile (no touch): Also scales the content on the page when resizing the window, but continues to use your regular mouse cursor for your click actions.
Desktop: Does not scale content, uses regular mouse cursor (full fledged desktop development / testing).
Desktop (touch): Also does not scale content, but replaces your regular mouse cursor with a circle that will simulate screen touches on click.
But I still want to emulate a specific mobile device...
There is still a way to override the user-agent with this Mobile (no touch) setting set. When you're looking at your console (brought up via F12), you'll see the 3 vertical circles there next to the console tab, click them and bring up Network Conditions. Within this section you'll see that User agent is set to Select Automatically, just turn this off and use the drop-down to change to the user-agent you want to emulate as. This will allow you to emulate as a specific mobile device.
This cursor indicates a "touch", such as your finger, for emulating touch events in Chrome browser.
In the dev tools window, click the settings (gear) button in the bottom right. Go to the Overrides tab and disable Emulate touch events.
I'm posting this here because it took me a LONG while to find it via searches, and I know others have been having the same issue.
Update via Paulo Manuel Santos' comment:
From Chrome 32 the Emulation is configured in a different place. This is how I get to it: Elements, press Esc, Emulation, Sensors, Emulate touch screen
At july 2017 this option calls Add device type:
On Chrome 50 it seems the Emulation option is not available..
My workaround was to add a custom device with the 'Mobile (no touch)' option..
When you click this ICON to activate (change to blue); The Grey Circle CURSOR will appear as representing finger touch for devices, and Deactivating this will simulate desktop version and Showing POINTER Cursor.
None of the above answers worked for me... So after clicking the aforementioned 3 dots in the bottom right corner, I selected Settings and then Restore defaults and reload
It's not a clean solution, but I had just to choose a new dock side position and then I was back to work
Just deselect the Toggle device toolbar
https://i.stack.imgur.com/3lcFl.png

UIWebView loading/randering error after resize

I have a screen with 2 UIWebView. The user can drag the views left and right to make the right and left view bigger (respectively) and the other one smaller (like UISplitView but customized and self made). I'm loading .html pages from strings and local .css files. After resizing the UIWebView If I load a new page there will be a black or white stripe on the right side of the UIWebView. This stripe is part of the web view (not a space between the views), and if I scroll the webView up and then down, the stripe will vanish and the page will be presented correctly. This issue occurs only in iOS 6 and only on the device (on the simulator it doesn't occur).
Some notes:
- The .css file contains elements with fixed position. Changing to absolute position didn't solve the problem but changed it: the black stripre occured during the drag.
- As slower the drag is, the stripe will be bigger.
- After resize the page is presented correctly, only when I load a new page the stripe is shown.
- The time between resizing the web view and loading a page doesn't matter, it can be straight away or after couple of minutes.
Now, as a workaround I create a new UIWebView and copy the old properties to the new. But than I need to reload the presented page which make a white blink...
Any idea why does it happens, and how to fix it?
sorry by the late feedback, but recently I was experimenting what appears to be the same problem.
I was using an UIWebView to show some text into a grid view. The "layout" of the grid view was different from portrait to landscape, and I was working with percents of the cell to build both (landscape and portrait) grid frames, in my case it makes the web view not to have an integer size.
It makes me thought that it can be some half-pixel issue after the web view resizing.