Two issues when I try to view an org chart on a mobile platform:
1. Scaling doesn't seem to be appropriate (looks way too small)
2. The 'canvas' is not being calculated correctly (it cuts off halfway down the screen).
Screenshot attached
Anyone else looking at this on a mobile platform?
Related
I am having an issue with auto scaling while trying to create a Windows forms app. I'm currently running on a Dell laptop with a 3840 x 2160 display (4K). I'm trying to add an image to a picture box, and if I leave the picture at its native size (which is quite small on my display) it appears at a correct autosized scale when I go to run the app. The issue with this is at the native picture's size it is very difficult to lay out all the other items I want to add to the app. If I increase the size of the picture to something that is usable it increase the size of the image to something large enough it doesn't fit on my screen. I know this is likely due to the auto scaling Windows 10 does, but I wanted to see if anyone else might have a work around for this? I've tried to see if there is a way to zoom in the display in the designer window, but I haven't found anything. I have also noticed the size of the windows forms app itself changes depending on where I have items placed on it.
I don't know that I completely understand what you're asking, but I would assume it could have something to do with the pixel units of your elements. Here's an excellent explanation of point-based vs pixel-based sizing
I have a mobile game developed by U3D and NGUI and targeted to platforms such as android and IOS, but there are so many mobile resolutions and aspect ratios change from 1.3 to event 2. My UI are designed under resolution 1136x640, and UIRoot Scaling style is FixedSize, Manual Height is 640.
I am not going to use anchors in NGUI widgets because distance is defined in pixels but not in percentages, when resolutions are changed, relative position of widgets are also changed, this is not what I want.
I refer this but still have no idea to handle this tricky problem perfectly, I need some suggestions on how to use NGUI in right way to handle different mobile resolutions.
The newest (3.x.x) NGUI allows you to use their new anchoring system. As you said, it is specified in pixels, however you can specify different targets and distances to different edges, and it will behave similarly to percentages.
Are you familiar with NGUI team videos explaining their new releases?
https://www.youtube.com/watch?v=6k5iIzKTEBQ
Some of the information there could be helpful, and playing with Custom settings of anchors either.
Another useful things is to create scaling script attached to root, which scales all elements down, basing on the detected dpi. If your UI is prepared for phones, you probably won't need all the buttons to take the same percent of the screen on tablets.
I am building a application in codename one which has a log-in age.
I have a created a UI as the requirements but when i build the application from codename one's server for android then i see that a streamed background image gets distorted and convert in to lines.
The background image has a gradient from 3 dimension to center top.
I checked it in codename one simulator its looks fantastic but in android emulator background image gets distorted.
Please check attached image for it. i have added two image 1st is of codename one's emulator and 2nd one is android emulator.
Please let me know that i do.
You have a background gradient, the devices have a limited number of colors so the background will be distorted to some degree as the colors are adapted to the lower color count on the device.
This is assuming you didn't use a mutable image or a round rect border (not image border), in those two cases the number of colors might be lower because of drawing to an image surface that might be 16bit.
I have been searching for any info on this without success.
I am updating an application that has two versions. A WPF windows app and an MVC web app. The requirement is that they must look the same.
Why when I add an image of, say, 100px X 100px to both the image in the web app looks larger than the image in the win app?
If I add margins the space between the items looks more in the win app than it does in the web app.
I thought I was mistaken so I physically measured both and confirmed the differences.
I want the 100X100 image in both apps to look the same and do not want to up size as this will distort the image.
Can anyone explain why this would happen and any way I can get around it?
Many Thanks
Fred
Assuming no styling is being applied to the images either in XAML or CSS, they could still be different because WPF pixels are device independent.
I guess you could set the ScaleTransform of your WPF app to match the desired size, but remember this will be different depending on monitor size and Windows DPI settings.
I am using a script from http://detectmobilebrowsers.com/ to detect whether a site is being viewed on a mobile browser.
If the site is on a mobile browser, I show a pared down, simple slideshow. If it is a regular browser, I show a whiz-bang super slideshow. I'd like to optimize my images, making them as small as possible on the mobile slideshow. My mobile slideshow is responsive, so it will shrink to fit in whatever window, but I don't want to make it any larger initially than it absolutely has to be.
Does anyone know what the maximum width is on the current array of mobile browsers? Or rather, the maximum width of mobile devices that are detected with the http://detectmobilebrowsers.com/ script?
BTW, I'm not asking how to detect the width once the page is loaded in a browser.
Thank you!!
Edit....
I think you guys misunderstood my question. I AM using max-width:100%. My images DO scale to fit any screen-size. And, I DO determine whether to show a simple slideshow or a complex one. Here's my logic:
If the user is using a mobile device (based on the device detector)
show a simple slideshow
Else the use is NOT using a mobile device (based on the device detector)
If this is a small screen (based on media queries)
show a simple slideshow
Else this is a large screen (based on media queries)
show a complex slideshow
End If (based on media queries)
End If (based on the device detector)
Why bother using mobile detection at all? Because even though for small screens I am only showing the simple, low-filesize slideshow on small screens, the images from the complex, image-heavy, high-filesize slideshow ARE STILL DOWNLOADED (http://cloudfour.com/examples/mediaqueries/image-test/). My media query determination of which slideshow to show doesn't save the user from having to download the images of the slideshow that's currently not shown. It's only used because the simple slideshow looks better on small screens than the complex one. Using the mobile detection screen makes sure that images that aren't shown, aren't downloaded.
Why do I care what the maximum width is on current mobile devices, when my images are set to 100% width and will scale down to fit any size? Because a 900px wide image has a larger filesize than a 600px wide image. If I know what the max width is that the image needs to be, I can save the slide down to that size initially, saving some additional bandwidth. Have you guys ever viewed a slideshow on a mobile device? Slow!
I would really appreciate if anyone can point me towards the proper stats. I googled, but couldn't find what I needed.
The answer is almost certain to change as soon as you deploy the software.
It also depends on whether you mean pixels or screen-resolution-pixels (the Retina displays define them differently).
Perhaps it's best to stick with detecting mobile browsers (if you don't like the scripts you're using, see , e.g.:
Detecting mobile browsers on the web?)
and then let users opt into higher-rez images.
Alternately, you could try to detect bandwidth, which is really what you're optimizing for; 'mobile' is just a proxy for this, and only moderately correlated with it.