The dimensions and sizes must be distinguished by the following units: dp, sp, pt, px, mm, in
Px: pixel, in the unit of pixel size. In the android UI, this unit is the same as the actual physical screen resolution, and is mainly used to display the definition effect.
Dp: Density-independent Pixels (device independent pixel), short for "dp", that is, dip. It is an abstract unit, because the physical screen is large and small, however, dp displays the same size on different physical screens, t
How do I adapt to the various screen sizes of Android smartphones using Qt-developed Android apps?When it comes to screen sizes, from 2.8-inch to 8.9-inch phone screens, it's a little more painful for program apes. The Android project itself has considered this issue, resource files, ldpi/mdpi/hdpi/xhdpi, and so on, the Android framework automatically selects the appropriate icon based on the screen size, so that the application looks the same on different screen sizes.What about the Qt applicat
Camera pictures, pictures on the computer, text in Word, computer screen, mobile screen, camera screen display size Everything's all figured out!First, the picture.xxdpi= points DotX is the actual size of the picture, simple point, we only calculate the height of the picture, for example, took a picture 144x144 72dpi, then its actual height is 144÷72=2 inchesDPI is the dots per inch, after the camera has taken a picture of its DPI is determined (right
. The height is calculated based on the aspect ratio of the device screen. (In fact, the height of the viewport is almost useless and can be ignored)
In this way, the width and height of the viewport provided for CSS computing are similar to those of the desktop browser, and the rendering Effect of page computing is almost the same as that of the desktop browser. Page zoom-in does not affect layout viewport, that is, does not affect page rendering.
In a mobile browser, when all pages are
undoubtedly possible, but it is not universal... The following is an example:
Let's first implement the process of setting the height of the ImageView to make the image display a normal proportion in this specific simulator:
The actual pixel size of the above image is: 828*314, the ratio of width to height is about 2.43, and the size of the simulator we use here is 480*800 (unit: px, that is, pixels), that is to say, the width of the pixel is 480, so we need to set the height of this ImageVie
In the past two days, I used swing to write and print data. I found that the JDK document contains a description in units of 1/72 inch. It is troublesome to convert the paper size and screen size. What is 1/72 inch. I found the following information and finally found the conversion formula. Let's record it here :)
72 pixels/inch = 28.346 pixels/centimeter
300 pixels/inch = 118.11 pixels/centimeter
1 CM = 0.3937 inch
1 inch = 2.54 cm
Later I found another article, which is fully written.
Article:
WebApp development in the early days, will encounter the PC-side development of the page in the mobile display too big problem, here need to add META tags in the HTML head to control the zoomHere are specific instructions for this tag:Viewport Syntax Introduction:The content contains several properties:height = [Pixel_value | Device-height] ,width = [Pixel_value | device-width],Initial-scale = Float_value,Minimum-scale = Float_value,Maximum-scale = Float_value,user-scalable = [yes | no],target-d
= [Dpi_value | device-dpi | high-dpi | medium-dpi | low-dpi]
11
"
12
/>
WidthControls the size of the viewport, you can specify a value or a special value, such as device-width as the width of the device (in pixels of the CSS when scaled to 1
= [Dpi_value | device-dpi | high-dpi | medium-dpi | low-dpi]
11
"
12
/>
WidthControls the size of the viewport, you can specify a value or a special value, such as device-width as the width of the device (in pixels of the CSS when scaled to 1
= [Dpi_value | device-dpi | high-dpi | medium-dpi | low-dpi]
11
"
12
/>
WidthControls the size of the viewport, you can specify a value or a special value, such as device-width as the width of the device (in pixels of the CSS when scaled to 1
= [Dpi_value | device-dpi | high-dpi | medium-dpi | low-dpi]
11
"
12
/>
WidthControls the size of the viewport, you can specify a value or a special value, such as device-width as the width of the device (in pixels of the CSS when scaled to 1
. Here, the square-dimensional network describes how a viewport feature of HTML5 allows the website to adapt to different resolutions of the mobile browser.The viewport syntax is as follows:Content= "Height = [Pixel_value | device-height],width = [Pixel_value | device-width],Initial-scale = Float_value,Minimum-scale = Float_value,Maximum-scale = Float_value,user-scalable = [yes | no],Ten target-densitydpi = [Dpi_value | device-dpi | high-
Comments: Developing mobile apps with html5 is the best choice. However, each mobile phone has different resolutions and screen sizes. How can we make the developed applications or page sizes suitable for various high-end mobile phones?
With the prevalence of high-end mobile phones (such as Android, Iphone, Ipod, and WinPhone), mobile Internet application development has become increasingly popular. html5 is the best choice for mobile app development. However, each mobile phone has different res
Use of viewport in HTML5 Development
With the prevalence of high-end mobile phones (such as Android, iPhone, iPod, and winphone), mobile Internet application development has become increasingly popular. HTML5 is the best choice for mobile app development. However, each mobile phone has different resolutions and screen sizes. How can we make the developed applications or page sizes suitable for various high-end mobile phones? Learning how to use HTML5 viewport can help you do this ...... Viewport
generailized size/density.
In actual Layout design, the Unit should be dp, which can avoid the impact caused by different screen dpi. The most typical example is Apple's retina screen.
Xlarge: at least 960dp x 720dp
Large: at least 640dp x 480dp
Normal: at least 470dp x 320dp
Small: at least between DP x 320dp
Px = dp * (dpi/160)
For example, for a 1.5 DPI
HTML5, And the viewport label is added below.
Nusamibia
2013-03-31 21:08:33
Http://site.com-Site1 site
Using http://www.maoegg.com/the-usage-of-viewport-in-html5/ for viewport in HTML5
When developing a mobile app with HTML5, users will often encounter different resolution or screen sizes of mobile phones. How can we make the developed app or page size suitable for various mobile phones? Viewport in html5.Viewport Syntax:
Content ="Height = [pixel_value |
of the logical pixel to design and develop the page. Just prepare the resource map, you need to prepare twice times the size of the figure, through the code to shrink it 1 time times the size of the display, to ensure clarity.Practical applicationPeople are most concerned about the actual use of the canvas how to set. We combed through three platforms on iOS, Android, and web. But before I do, I'm going to introduce a little trick for a friend who is designing with PS.As I said before, we want
With HTML5 documents to make the page on the effect of the PC is no problem, but the mobile browser will zoom to the page is very small, you can see the entire page but can't see the word!! Just add the META tag to the Page Head tab viewport statement: can help you solve this seemingly bad problem. Viewport Syntax Introduction: Content= "Height = [Pixel_value | device-height],width = [Pixel_value | device-width],Initial-scale = Float_value,Minimum-scale = Float_value,Maximum-scale = Float_value
= [Dpi_value | device-dpi | high-dpi | medium-dpi | low-dpi]
11
"
12
/>
WidthControls the size of the viewport, you can specify a value or a special value, such as device-width as the width of the device (in pixels of the CSS when scaled to 1
category). So after android3.2, this classification is not used, the new classification method is defined by the available screen width, in the project resource file (such as layout) use, here are some examples: LAYOUT-SW600DPLAYOUT-SW720DPVALUES-SW340DP the definition of these classifications will be explained in detail later, now we have a concept.Screen densitiesThere are several concepts to understand before you speak screen densities: px,ppi,dpi
The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion;
products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the
content of the page makes you feel confusing, please write us an email, we will handle the problem
within 5 days after receiving your email.
If you find any instances of plagiarism from the community, please send an email to:
info-contact@alibabacloud.com
and provide relevant evidence. A staff member will contact you within 5 working days.