调整& lt; asp: Image>基于用户屏幕分辨率

本文关键字：于用户 用户 分辨率 屏幕 lt asp Image 调整 | 更新日期: 2023-09-27 18:19:01

我想在屏幕上显示一个图像，它的大小(高度和宽度)必须调整以适应屏幕(拉伸或收缩)。图片已保存到服务器，尺寸为1024 * 768(例如)。

现在，我这样做:

ImageUtilities.Dimension d = 
    ImageUtilities.ImageUtilities.GetImageSize(f.FullName);
var newD = ImageUtilities.ImageUtilities.GetResized(d.Height, d.Width, 520, 520);
Image1.Height = newD.Height;
Image1.Width = newD.Width;

所以，目前，我强迫我的图像适合一个正方形大小的800 × 800(我考虑到纵向vs横向，并使用比例来保持长宽比。

问题是，在低分辨率的屏幕上，用户必须滚动一点才能到达图像的底部(我有一个关闭按钮)。在一个非常高分辨率的屏幕上，我可以保持1024 * 1024的可用面积。

是否有一种方法来获得屏幕分辨率，并采取这些参数到我的代码背后的方法(getresize是一个方法，返回我一个新的高度和宽度)?

我知道用户可能没有最大限度地使用他的浏览器-没关系。

调整& lt; asp: Image>基于用户屏幕分辨率

你可以用百分比来定义图像的大小，这样你就可以从这些东西中解脱出来了。

使用Javascript获取监视器屏幕分辨率，然后在Javascript中更改图像大小，或者将屏幕分辨率传递给您的代码并使用c#更改图像大小。

如果你需要关于屏幕分辨率的信息，你可以使用window.screen，它有以下属性:

Properties  | Description

availHeight | Specifies the height of the screen, in pixels, minus interface     
            |     features such as the taskbar in Windows.
availWidth  | Specifies the width of the screen, in pixels, minus interface 
            |     features such as the taskbar in Windows.
colorDepth  | The bit depth of the color palette available for displaying images 
            |     in bits per pixel.
height      | The total height of the screen, in pixels.
pixelDepth  | Display screen color resolution (bits per pixel). Firefox  
            |     exclusive property.
width       | The total width of the screen, in pixels.

如前所述，最好在客户端而不是服务器端处理此类场景。我建议使用CSS样式或JavaScript。

更多信息:

  • http://buildinternet.com/2009/07/quick-tip-resizing-images-based-on-browser-window-size/
  • 根据浏览器窗口尺寸自动调整图像大小

您是否考虑过创建一个自定义服务器控件来根据屏幕分辨率调整图像的大小?下面的示例将MaxWidth属性添加到Image控件中，但您可以修改它以将最大宽度/高度设置为与屏幕分辨率成比例:

using System;
使用包含

;使用System.Web.UI.WebControls;

MyNameSpace

名称空间{公共类MaxWidthImage:图像{private int _MaxWidth;

public int MaxWidth
{
    get
    {
        return _MaxWidth;
    }
    set
    {
        _MaxWidth = value;
    }
}
protected override void OnPreRender(EventArgs e)
{
    if (string.IsNullOrEmpty(ImageUrl)) return;
    using (System.Drawing.Image MyImage =
        System.Drawing.Image.FromFile
        (HttpContext.Current.Server.MapPath(ImageUrl)))
    {
        int CurrentWidth = MyImage.Width;
        if (MaxWidth != 0 && CurrentWidth > MaxWidth)
        {
            CurrentWidth = MaxWidth;
        }
        Attributes.Add("width", CurrentWidth.ToString());
    }
}

}}

(http://evonet.com.au/extending-the-aspimage-control-to-set-a-maximum-width/)

我在寻找一些不同的东西，但得到了一个线索，我将遵循，可能会帮助别人。

我的想法是根据用户的屏幕宽度调整图像服务器端的大小，以节省下载时间。我忘了JS的window.screen。例如，我可以在获取图像之前将其设置为image.php?id=1&ws=1280，并根据需要在服务器端将其缩小。这在服务器上做了一点工作，但在用户设备上，如果他们在一个小屏幕上，速度会快得多。

不确定它在智能手机上的效果如何(scale=1)，但它可能会有所进展。

只是一些想法，可能会帮助别人。

相关文章：