我正在设计一个网站,需要将大幅图像重新塑造为400Wx264H的层面,而无需疏漏。
我致力于不同的法典文本,但都回过来。
现在,在保持相关比例的同时,将大图像转成400瓦,然后允许用户选择使用jCrop的部分图像是可选择的领域350瓦克斯230H。
有时,如果图像重的高度或宽度小于400瓦或264赫克,则会给图像增加黑部分。
如果有人能向我指出我必须做的一些类似事情,我将不胜感激。
CODE for Upload and resizing culture is BELOW
public void ResizeImageFreeSize(string OriginalFile, string NewFile, int NewWidth, int MaxHeight, bool OnlyResizeIfWider, string fileExtension)
{
System.Drawing.Image FullsizeImage = System.Drawing.Image.FromFile(OriginalFile);
// Prevent using images internal thumbnail
//FullsizeImage.RotateFlip(System.Drawing.RotateFlipType.Rotate180FlipNone);
//FullsizeImage.RotateFlip(System.Drawing.RotateFlipType.Rotate180FlipNone);
//if (OnlyResizeIfWider)
//{
// if (FullsizeImage.Width <= NewWidth)
// {
// NewWidth = FullsizeImage.Width;
// }
//}
//int NewHeight = FullsizeImage.Height * NewWidth / FullsizeImage.Width;
//if (NewHeight > MaxHeight)
//{
// // Resize with height instead
// NewWidth = FullsizeImage.Width * MaxHeight / FullsizeImage.Height;
// NewHeight = MaxHeight;
//}
System.Drawing.Image NewImage = FullsizeImage.GetThumbnailImage(NewWidth, MaxHeight, null, IntPtr.Zero);
// Clear handle to original file so that we can overwrite it if necessary
FullsizeImage.Dispose();
// Save resized picture
if (fileExtension.ToLower() == ".jpg" || fileExtension.ToLower() == ".jpeg")
{
//NewImage.Save(NewFile, System.Drawing.Imaging.ImageFormat.Jpeg);
Encoder quality = Encoder.Quality;
var ratio = new EncoderParameter(quality, 100L);
var codecParams = new EncoderParameters(1);
codecParams.Param[0] = ratio;
NewImage.Save(NewFile, GetEncoder(ImageFormat.Jpeg), codecParams);
}
if (fileExtension.ToLower() == ".png")
{
NewImage.Save(NewFile, System.Drawing.Imaging.ImageFormat.Png);
}
if (fileExtension.ToLower() == ".gif")
{
NewImage.Save(NewFile, System.Drawing.Imaging.ImageFormat.Gif);
}
}
ABOVE code upload the large image and re size it to fixed size of 400x264 pixels. but this approach stretches the image as i have comments the code which maintains the aspect ration.
在重层图像上载后,即允许用户从这种图像中选取该地区,可选择可选取350x230皮克。
这部作品没有任何问题,但形象紧张。
protected void btnCrop_Command(object sender, CommandEventArgs e)
{
cropImage();
// pnlImageDetails.Visible = true;
}
protected void cropImage()
{
var x = int.Parse(_xField.Value);
var y = int.Parse(_yField.Value);
var width = int.Parse(_widthField.Value);
var height = int.Parse(_heightField.Value);
string _CropImagePath = Session["_CropImagePath"].ToString();
using (var photo = System.Drawing.Image.FromFile(_CropImagePath))
using (var result =
new Bitmap(width, height, photo.PixelFormat))
{
result.SetResolution(photo.HorizontalResolution, photo.VerticalResolution);
using (var g = Graphics.FromImage(result))
{
// g.InterpolationMode = InterpolationMode.HighQualityBicubic;
g.InterpolationMode = InterpolationMode.HighQualityBicubic;
g.DrawImage(photo, new Rectangle(0, 0, width, height),
new Rectangle(x, y, width, height),
GraphicsUnit.Pixel);
photo.Dispose();
result.Save(_CropImagePath);
string filePath = _CropImagePath.ToString();
System.IO.FileInfo f = new System.IO.FileInfo(filePath);
string fileExtension = f.Extension;
string fileName = f.Name;
string[] fNameArray = fileName.Split( . );
string fileNewName = fNameArray[0] + "TN" + f.Extension;
Session["ArticleThumbnailImage"] = fileNewName;
string fileNewPath = Server.MapPath("../ImagesArticles/") + fileNewName;
ResizeImageFreeSize(filePath, fileNewPath, 170, 112, true, fileExtension);
}
}
}
页: 1
<div id="ImageEditorFrame" style="width:800px; height:350px; float:left; ">
<div style="width:404px; height:268px; margin-left:160px; margin-top:10px; padding-top:1px; background-image:url( images/Scale.png ); background-repeat:no-repeat;">
<div style="width:400px; height:264px; margin-left:3px; margin-top:2px; padding-top:1px; background-color:#f5f5f5;">
<asp:Image runat="server" ID="_imageEditor" ImageUrl="" Visible="true" />
</div>
<div style="margin-top:10px;">
<asp:Button ID="btnCrop" runat="server" style="float:left;" Text=" Crop Image " Visible="False" oncommand="btnCrop_Command" />
<input id="w" type="text" name="w" size="4" disabled="disabled">
<input id="h" type="text" name="h" size="4" disabled="disabled">(350x230)<br /><br />
<asp:Label ID="lblUplodedImgInfo" runat="server" Text=""></asp:Label>
</div>
</div>
<input type="hidden" runat="server" id="_xField" />
<input type="hidden" runat="server" id="_yField" />
<input type="hidden" runat="server" id="_widthField" />
<input type="hidden" runat="server" id="_heightField" />
</div>
var editorID = <%= _imageEditor.ClientID %> ;
jQuery(function () {
jQuery( # + editorID).Jcrop({
onChange: showCoords,
onSelect: showCoords,
setSelect: [0, 0, 350, 230],
allowResize: false
});
});
function showCoords(c) {
var xField = document.getElementById( <%= _xField.ClientID %> );
var yField = document.getElementById( <%= _yField.ClientID %> );
var widthField = document.getElementById( <%= _widthField.ClientID %> );
var heightField = document.getElementById( <%= _heightField.ClientID %> );
xField.value = c.x;
yField.value = c.y;
widthField.value = 350;
heightField.value = 230;
$( #w ).val(c.w);
$( #h ).val(c.h);
}
Screen Shot for idea
如果能让用户拥有选择图像和图像领域的功能,并由此形成重新形象,我将热心这样做。 如今,法典并没有产生完美的结果。
如果有人能够帮助我,我就是一个完整的工作榜样。
关于