Как добавить логотип водяного знака при загрузке изображения в MVC

Question

Как добавить изображение водяного знака при загрузке изображения в asp.net mvc. Я использую несколько файлов jquery.uploadfile.min.js для загрузки изображения. Хотите добавить автоматически сохраненное изображение логотипа (водяной знак), чтобы добавить его в мой файл изображения, который я собираюсь загрузить.

ВИД:

var errorOccured = false;
$(function () {
    var uploadObj = $("#multipleupload").uploadFile({
        url: "./Handler.ashx",
        multiple: true,
        fileName: "myfile",
        maxFileSize: 1024 * 5000,
        allowedTypes: "jpg,jpeg,gif,png",
        autoSubmit: false,
        formData: { "FunctionName": "UploadProductImage", "ProductID": '@clsEncrypt.Encrypt(ViewBag.ProductID.ToString())' }, //"ImgResizeOption": ImgResizeOption
        afterUploadAll: function () {
            if (!errorOccured) {
                window.location.href = 'ProductImage?Product=@(clsEncrypt.Encrypt(ViewBag.ProductID.ToString()))';
            }
        },
        onError: function (files, status, errMsg) {
            alert('file(s) could not be uploaded. Error: ' + errMsg);
            errorOccured = true;
        }
    });

    $("#startUpload").click(function () {
        uploadObj.startUpload();   
    });
});

В HANDLER:

    public void UploadProductImage()
    {
        int ProductID = Convert.ToInt32(clsEncrypt.Decrypt(HttpContext.Current.Request["ProductID"]));
        string PhysicalFolderPath = "~/Images/Product/";

        for (int j = 0; j < HttpContext.Current.Request.Files.Count; j++)
        {
            HttpPostedFile uploadFile = HttpContext.Current.Request.Files[j];
            string extention = System.IO.Path.GetExtension(uploadFile.FileName);
            UploadPic(uploadFile, j++, PhysicalFolderPath, ProductID);
        }
    }

    protected void UploadPic(HttpPostedFile FUPhoto, int sort, string RemotePath, int ProductID)
    {
        if (FUPhoto.FileName != "")
        {
            string ImgUploadResponse = "";
            string strExt = Path.GetExtension(FUPhoto.FileName).Trim().ToLower();
            string ImageName = DateTime.Now.ToFileTimeUtc() + strExt;
            string OriginalImageFullPath = "~/Images/Product/" + ImageName;
            if (Directory.Exists(HttpContext.Current.Server.MapPath("~/Images/Product/")).Equals(false))
                Directory.CreateDirectory(HttpContext.Current.Server.MapPath("~/Images/Product/"));
            FUPhoto.SaveAs(HttpContext.Current.Server.MapPath(OriginalImageFullPath));

            ProductImageEntity objProdImage = new ProductImageEntity();
            objProdImage.ProductID = ProductID;
            if (ImgUploadResponse != "")
                objProdImage.Image = "";
            else
                objProdImage.Image = ImageName;
            if (!String.IsNullOrEmpty(objProdImage.Image))
                new ProductImageBLL().InsertUpdateProductImage(objProdImage);
        }
    }

Answer 1

Пожалуйста, обратитесь к приведенному ниже коду для добавления логотипа водяного знака со стороны кода.

using (Image image = Image.FromFile(@"C:\Users\Public\Pictures\Sample Pictures\Desert.jpg"))
    using (Image watermarkImage = Image.FromFile(@"C:\Users\Public\Pictures\Sample Pictures\watermark.png"))
    using (Graphics imageGraphics = Graphics.FromImage(image))
    using (TextureBrush watermarkBrush = new TextureBrush(watermarkImage))
    {
        int x = (image.Width / 2 - watermarkImage.Width / 2);
        int y = (image.Height / 2 - watermarkImage.Height / 2);
        watermarkBrush.TranslateTransform(x, y);
        imageGraphics.FillRectangle(watermarkBrush, new Rectangle(new Point(x, y), new Size(watermarkImage.Width+1, watermarkImage.Height)));
        image.Save(@"C:\Users\Public\Pictures\Sample Pictures\Desert_watermark.jpg");
    }

Answer 2

Недавно я опубликовал пакет слепков, который добавляет водяной знак изображения с контролем над непрозрачностью и целевым местом для размещения водяного знака. Кроме того, вы можете добавить текстовый водяной знак, а также обрезать / изменить размер изображения.

установить через самородок:

Install-Package LazZiya.Resize

, затем вы можете использовать код, как показано ниже:

//get image from local path
var img = Image.FromFile("wwwroot\\images\\lum3n-358833-unsplash.jpg");

//scale and crop, 600x250 center focus 
var newImg = ImageResize.ScaleAndCrop(img, 600, 250, TargetSpot.Center);

//watermark image path
var imgWatermark = "wwwroot\\images\\icon.png";

//add image watermark
newImg.ImageWatermark(imgWatermark, 
                TargetSpot.TopRight, //define target spot
                10,                  //margin
                37);                 //opacity (0-100)

//save new image
newImg.SaveAs("wwwroot\\images\\600x250-image-watermark.jpg");

//dispose to free up memory
img.Dispose();
newImg.Dispose();

см. демонстрационная страница в реальном времени для получения дополнительной информациидетали