Ti Vídeo Tutoriais: Creating HTML styles with cutting image files in C# ( css sprites to forms web )

quarta-feira, 23 de julho de 2014

Creating HTML styles with cutting image files in C# ( css sprites to forms web )

This is the way that I costume to take when I make my HTML styles.
It is too easy to work.
After the job, we can cut all the image files.

/*
* Created by Luiz Augusto S. Prado
* www.codigorapido.com.br
* consultancy: codigorapido2012@gmail.com
* Date: 22/07/2014
*/

using System;
using System.IO;
using System.Drawing;
using System.Windows.Forms;
using System.Drawing.Imaging;

namespace cutting
{
    class Program
    {
        // function from microsoft site
        static public Bitmap Copy(Bitmap srcBitmap, Rectangle section)
        {
            // Create the new bitmap and associated graphics object
            Bitmap bmp = new Bitmap(section.Width, section.Height);
            Graphics g = Graphics.FromImage(bmp);

            // Draw the specified section of the source bitmap to the new one
            g.DrawImage(srcBitmap, 0, 0, section, GraphicsUnit.Pixel);

            // Clean up
            g.Dispose();

            // Return the bitmap
            return bmp;
        }

        static public string getTotalHtml(string style, string html)
        {

            return "<!DOCTYPE html>\n"+
                "<html>\n" +
                "    <head>\n" +
                "        <style>\n"+
                style+
                "        </style>\n" +
                "    </head>\n" +
                "    <body>\n"+
                html+
                "    </body>\n" +
                "<html>\n";
        }

        public static void execute( int[,] matrix, string imageName )
        {
            Rectangle myRect1 = new Rectangle();

            style += ".frame\n";
            style += "{"+"\n";
            style +=         "position: relative;\n";
            style += "}\n\n";

            string style = "";
            string html = "<div class='frame'>\n";

            int old_y = 0;
            for(int x=1; x<matrix.GetLength(0) ; x++)
            {
                int old_x = 0;
                for(int y=1; y<matrix.GetLength(1) ; y++)
                {

                    html+="<div class='frame_"+x+"_"+y+"'></div>\n";

                    //=============================================================

// Creating the style to the cell.
//=============================================================

                    style += ".frame_"+x+"_"+y+"\n";
                    style += "{"+"\n";
                    style +=         "background: url('Frame.png') -"+old_x+"px -"+old_y+"px;"+"\n";
                    style +=         "position: absolute;"+"\n";
                    //=============================================================

                    if( matrix[x,y]==0 )
                        style +=         "background-repeat: no-repeat;"+"\n";
                    else if( matrix[x,y]==8 )
                        style +=         "background-repeat: repeat-x;"+"\n";
                    else if( matrix[x,y]==1 )
                        style +=         "background-repeat: repeat-y;"+"\n";
                    else if( matrix[x,y]==9 )
                        style +=         "background-repeat: repeat;"+"\n";
                    //=============================================================

                    style +=         "width: "+myRect1.Width+"px;"+"\n";
                    style +=         "height: "+myRect1.Height+"px;"+"\n";
                    style +=         "top: "+old_y+"px;"+"\n";
                    style +=         "left: "+old_x+"px;"+"\n";
                    style += "}"+"\n"+"\n";
                    //=============================================================

                    //=============================================================

// if you wanna to cut all yours images, it will help us safeguard our job
//=============================================================

                    if(false)
                    {
                        Bitmap bitmap = new Bitmap(imageName);
                        myRect1.X = old_x;
                        myRect1.Y = old_y;
                        myRect1.Width  = matrix[0,y];
                        myRect1.Height = matrix[x,0];
                        Bitmap bmp = Copy(bitmap, myRect1 );
                        FileInfo fi = new FileInfo("Frame_"+x+"_"+y+".png");
                        FileStream fstr = fi.Create();
                        bmp.Save(fstr, ImageFormat.Png);
                        fstr.Close();
                    }
                    old_x += matrix[0,y];
                }
                old_y += matrix[x,0];
            }
            html += "</div>";


            MessageBox.Show( getTotalHtml(style, html) );

            Console.Write("Press any key to continue . . . ");
            Console.ReadKey(true);
        }

        public static void Main(string[] args)
        {
            // this is our matrix
            // column  0 is the width  of the cell
            // line    0 is the height of the cell
            int[,] matrix = new int[,]
            {
                {0,  5,2,19,2,5},
                {5,  0,0, 1,0,0},
                {26, 0,0, 1,0,0},
                {2,  0,0, 1,0,0},
                {33, 8,8, 9,8,8},
                {2,  0,0, 1,0,0},
                {5,  0,0, 1,0,0}
            };
            execute(matrix, "Frame.png");
        }
    }
}

//This is the image that I'm using in this source:

Nenhum comentário:

Postar um comentário