Ankündigung

Einklappen
Keine Ankündigung bisher.

[Erledigt] Transparente Runde Ecken bei Thumbnial realisieren

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • [Erledigt] Transparente Runde Ecken bei Thumbnial realisieren

    Hallo Leute,

    wie der Titel schon ausagt, möchte ich gerne bei generierten Thumbnials transparente runde ecken realisieren. Mir steht GD 2 zur verfügung.

    Da ich leider keine Ahnung davon habe, wie ich das in etwa realisieren kann, hoffe ich auf euere unterstützung. Ob das jetzt das richtige Forum ist, weiß ich auch nicht genau.

    Hier ist die klasse zum erstellen der Thumbnails (zum jetzigen Status):
    PHP-Code:
    error_reportingE_ALL E_STRICT );

    class 
    Thumbnail
    {
        protected 
    $new_image           0;
        
        protected 
    $old_image           0;
        
        protected 
    $old_dimensions       = array( );
        
        protected 
    $new_dimensions       = array( );
        
        protected 
    $cache_dir           '';
        
        protected 
    $cache_output        true;
        
        protected 
    $border_color        '#000000'// default black
        
        
    protected $border_size          0;
        
        protected 
    $round_corners       0;
        
        protected 
    $round_corners_color '#000000';
        
        protected 
    $type                'gif';
        
        protected 
    $path                ''// The path to the original image
        
        
    protected $add_sourceinfo      0// Add Sourcefile info (Filename, Source Dimensions and Filesize 
        
        
    protected $filename            '';
        
        
    /*
        ** Constructor funktion. It Set some variables
        **
        ** @param    : String  $path                     => The orignal image path to open.
        ** @param    : String  $type                     => The Output type (png,gif,jpeg)
        ** 
        ** @global   : Int     $sdasd                    => asdasdasd
        **
        ** return    : Void
        ** access    : Public
        */
        
    public function __construct$path ''$type 'source' )
        {
            
    $this->type = ( in_arraystrtolower$type ), array( 'gif''png''jpeg''bmp''source' ) ) ) ? strtolower$type ) : 'source';
            
            
    $this->path $path;
            
            if ( ! 
    $this->path || ! file_exists$this->path ) )
            {
                
    $this->Error'You must define the original Image for create an thumbnial' );
                return 
    false;
            }
            return;
        }
        
        
    /*
        ** Function to manipulating the Dimensions of the image, one of the paramter must be given...
        **
        ** @param    : String  $path                     => The orignal image path to open.
        ** @param    : String  $type                     => The Output type (png,gif,jpeg)
        ** 
        ** @global   : Int     $sdasd                    => asdasdasd
        **
        ** return    : Void
        ** access    : Public
        */
        
    public function SetDimensions$p false$w false$h false )
        {
            
            if ( ! 
    $w && ! $h && ! $p )
                
    $this->Error'You must set the dimensions for the image!' );
            
            
    // Create the New Dimensions with the max parameter (must be given)
            
            
    $this->new_dimensions = array(
                
    'p' => $p,
                
    'w' => $w,
                
    'h' => $h,
            );
            
            if ( 
    $p && ! $h && ! $w )
                
    $this->_CalculateDimensions'p' );
            else if ( 
    $w && ! $h && ! $p )
                
    $this->_CalculateDimensions'w' );
            else if ( 
    $h && ! $w && ! $p )
                
    $this->_CalculateDimensions'h' );
            else if ( 
    $h && $w && ! $p )
                
    $this->_CalculateDimensions'wh' );
            
            return;
        }
        
        public function 
    SetBorder$size 1$color '#000000' )
        {
            
    $this->border_color $color;
            
    $this->border_size  = (int) $size;
        }
        
        public function 
    SetRoundCorner$r$color true )
        {
            
    $this->round_corners       $r;
            
    $this->round_corners_color = ( $color === true ) ? 'transparent' $color;
        }
        
        public function 
    SetCache$path$filename false$output true )
        {
            
    $this->cache_dir    = ( file_exists$path ) ) ? $path '';
            
            if ( 
    $filename !== false )
                
    $this->save_name basename$filename );
            
            
    $this->cache_output $output;
        }
        
        public function 
    Execute( )
        {
            if ( ! 
    sizeof$this->new_dimensions ) || ! sizeof$this->old_dimensions ) )
                
    $this->Error'Cant Create Thumbnial. Dimensions not set!' );
            
            
    $this->_CreateThumbnial( );
            return 
    true;
        }
        
        private function 
    _CreateThumbnial( )
        {
            
    //
            // Ok now we can create the image...
            //
            // First get supportet image types
            //
            
    $this->support $this->_GetSupportedImageTypes( );
            
            
    //
            // No GD libery, ok so we can do here nothing more. Exit nicely
            //
            
    if ( $this->support'gd_version' ] === false || $this->support'type' ] === false )
                exit();
            
            
    //
            // Open Source Image
            //
            
    $this->_ObenSourceImage( );
            
            
    //
            // Create new Image width the calculated Informations
            //
            
    $gd2 = ( $this->support'gd_version' ] == ) ? true false;
            
            
    $this->new_image = ( $gd2 ) ? imagecreatetruecolor$this->new_dimensions'width' ], $this->new_dimensions'height' ] ) : imagecreate$this->new_dimensions'width' ], $this->new_dimensions'height' ] );
            
            
    //
            // Ok now we can copy
            //
            
    $function = ( $gd2 ) ? 'imagecopyresampled' 'imagecopyresized';
            
    $function$this->new_image$this->old_image0000$this->new_dimensions'width' ], $this->new_dimensions'height' ], $this->old_dimensions'width' ], $this->old_dimensions'height' ] );
            
            
    //
            // Ok the Imahe is now fish
            // We can destroy the source image
            //
            
    imagedestroy$this->old_image );

            
    //
            // Must we add Some Border arround the Image
            //
            
    if ( $this->border_size )
                
    $this->_AddBorder( );
            
            
    //
            // Must we add some round corners?
            //
            
    if ( $this->round_corners )
                
    $this->_AddRoundCorner( );
            
            
    //
            // Have we to add the SourceFile Informations?
            //
            
            
    $this->_Output( );
            
            return 
    true;
        }
        
        private function 
    _AddBorder( )
        {
            
        }
        
        private function 
    _AddRoundCorner( )
        {
            
    $round  $this->round_corners;
            
    $border $this->border_size;
            
            
            
    $color  imagecolorallocate$this->new_image255255255 );
            
            for( 
    $i 0$i $round$i ++ )
            {                          
    //  x1 y1  x2, y2
                
    imageline$this->new_image0$i$i0$color );
            }
        }
        
        private function 
    _Output( )
        {
            
    $type = ( $this->type == 'source' ) ? $this->support'type' ] : $this->type;
            
            
    $destination_path = ( $this->cache_dir ) ? ( ( $this->filename ) ? $this->filename md5basename$this->path ) ) . '.' $type ) : '';
            
            switch( 
    $type )
            {
                case 
    'gif' :
                    
    //
                    // Send Header
                    //
                    
    if ( ! $this->cache_dir || ( $this->cache_dir && $this->cache_output ) )
                        
    header'Content-type: image/gif' );
                    if ( 
    $this->cache_dir )
                        
    imagegif$this->new_image$destination_path );
                    
                    if ( ( 
    $this->cache_dir && $this->cache_output ) || ! $this->cache_dir )
                        
    imagegif$this->new_image );
                break;
                    
                case 
    'png' :
                    
    //
                    // Send Header
                    //
                    
    if ( ! $this->cache_dir || ( $this->cache_dir && $this->cache_output ) )
                        
    header'Content-type: image/png' );
                    
                    if ( 
    $this->cache_dir )
                        
    imagepng$this->new_image$destination_path );
                    
                    if ( ( 
    $this->cache_dir && $this->cache_output ) || ! $this->cache_dir )
                        @
    imagepng$this->new_image );
                break;
                
                case 
    'jpg' :
                    
    //
                    // Send Header
                    //
                    
    if ( ! $this->cache_dir || ( $this->cache_dir && $this->cache_output ) )
                        
    header'Content-type: image/jpeg' );
                    
                    if ( 
    $this->cache_dir )
                        
    imagejpeg$this->new_image$destination_path100 );
                    
                    if ( ( 
    $this->cache_dir && $this->cache_output ) || ! $this->cache_dir )
                        @
    imagejpeg$this->new_image );
                break;
                    
                case 
    'bmp' :
                    
    //
                    // Send Header
                    //
                    
    if ( ! $this->cache_dir || ( $this->cache_dir && $this->cache_output ) )
                        
    header'Content-type: image/bmp' );
                    
                    if ( 
    $this->cache_dir )
                        
    imagewbmp$this->new_image$destination_path );
                    
                    if ( ( 
    $this->cache_dir && $this->cache_output ) || ! $this->cache_dir )
                        
    imagewbmp$this->new_image );
                break;
                
                default:
                    
    //exit();
                
    break;
            }
            
            
            
    //
            // Destroy the thumb from memory
            //
            
    imagedestroy$this->new_image );
        }
        
        private function 
    _ObenSourceImage( )
        {
            switch ( 
    $this->support'type' ] )
            {
                case 
    'gif' :
                    
    $this->old_image = @imagecreatefromgif$this->path );
                break;
                
                case 
    'png' :
                    
    $this->old_image = @imagecreatefrompng$this->path );
                break;
                
                case 
    'jpg' :
                    
    $this->old_image = @imagecreatefromjpeg$this->path );
                break;
                
                case 
    'bmp' :
                    
    $this->old_image = @imagecreatefromwbmp$this->path );
                break;
            }
            
            return;
        }
        
        private function 
    Error$string )
        {
            
    //
            // Ok here we generate an errorimage
            //
            
    $width strlen$string ) * 7;
            
    $height 20;
            
            
    $img imagecreate$width$height );
            
            
    // Red Backgrounmd!
            
    imagefill$img00imagecolorallocate$img2293434 ) );
            
            
    //
            // write Text
            //
            
    imagestring$img200$stringimagecolorallocate$img255255255 ) );
            
            
    header'Content-type: image/png' );
            
    imagepng$img );
            
    imagedestroy$img );
            
            exit( );
        }
            
        private function 
    _GetSupportedImageTypes( )
        {
            if ( @
    extension_loaded'gd' ) )
            {
                
    $format imagetypes( );
                
                
    $new '';
                
                switch ( 
    $this->old_dimensions'type' ] )
                {
                    case 
    1// Gif
                        
    $new = ( $format IMG_GIF ) ? 'gif' false;
                    break;
                    
                    
    // Jpegs
                    
    case 2:
                    case 
    9:
                    case 
    10:
                    case 
    11:
                    case 
    12:
                        
    $new = ( $format IMG_JPG ) ? 'jpg' false;
                    break;
                    
                    case 
    3// PNG
                        
    $new = ( $format IMG_PNG ) ? 'png' false;
                    break;
                    
                    
    //
                    // Bitmap
                    //
                    
    case 6:
                    case 
    15:
                        
    $new = ( $format IMG_WBMP ) ? 'bmp' false;
                    break;
                }
                
                
    //
                // Ok now we check wicth gd version we have
                //
                
    if ( function_exists'imagecreatetruecolor' ) )
                    
    $version 2;
                else
                    
    $version 1;
                
                return array(
                    
    'gd_version' => $version,
                    
    'type'       => $new
                
    );
            }
            
            return array(
                
    'gd_version' => false,
                
    'type'       => false
            
    );
        }

        private function 
    _CalculateDimensions$type )
        {
            
    //
            // First of all we must get the original Image width
            //
            
    $this->old_dimensions getimagesize$this->path );
            
            if ( 
    $this->old_dimensions === false )
                
    $this->Error'Unable to get the imagesizes from the source image' );
            
            
    $this->old_dimensions = array(
                
    'width'  => $this->old_dimensions],
                
    'height' => $this->old_dimensions],
                
    'type'   => $this->old_dimensions],
            );
            
            switch( 
    $type )
            {
                case 
    'p':
                    if ( 
    $this->old_dimensions'width' ] > $this->old_dimensions'height' ] )
                    {
                        
    $this->new_dimensions += array(
                            
    'width'  => round$this->old_dimensions'width' ] * ( $this->new_dimensions'p' ] / $this->old_dimensions'width' ] ) ),
                            
    'height' => round$this->old_dimensions'height' ] * ( $this->new_dimensions'p' ] / $this->old_dimensions'width' ] ) )
                        );
                    }
                    else    
                    {
                        
    $this->new_dimensions += array(
                            
    'width'  => round$this->old_dimensions'width' ] * ( $this->new_dimensions'p' ] / $this->old_dimensions'height' ] ) ),
                            
    'height' => round$this->old_dimensions'height' ] * ( $this->new_dimensions'p' ] / $this->old_dimensions'height' ] ) )
                        );    
                    }
                break;
                
                case 
    'w':
                    
    $this->new_dimensions += array(
                        
    'width'  => round$this->new_dimensions'w' ] ), 
                        
    'height' => round( ( $this->old_dimensions'height' ] * $this->new_dimensions'w' ] ) / $this->old_dimensions'width' ] ),
                    );
                break;
                
                case 
    'h':
                    
    $this->new_dimensions += array(
                        
    'width'  => round( ( $this->old_dimensions'width' ] * $this->new_dimensions'h' ] ) / $this->old_dimensions'height' ] ), 
                        
    'height' => round$this->new_dimensions'h' ] ),
                    );
                break;
                
                case 
    'wh':
                    
    $this->new_dimensions += array(
                        
    'width'  => round$this->new_dimensions'w' ] ), 
                        
    'height' => round$this->new_dimensions'h' ] ),
                    );
                break;
                
                default:
                    
    $this->Error'Unknow calculation mode' );
            }
            
            return;
        }
    }    
            
    $thumb = new Thumbnail'./charts-arena.de/charts/0a4b0ae1745849945095d2b00fdc51e2.jpg''gif' );    

    $thumb->SetDimensions150 );
    $thumb->SetRoundCorner35true );

    $thumb->Execute(); 
    Ich habe natürlich google gefragt und auch selbst experimentiert, aber mir fehlt leider jeglicher ansatz, mit dem ich das realisieren könnte.

    Ich hoffe ihr versteht mich und bedanke mich bereits im Vorraus.
    [B]Mfg Tomtaz[/B]
    [I]"Es soll jetzt diese Erfindung geben.... Kugel oder so heißt die. Ist so eine Art Suchmaschine..." [/I]:!::shock:

  • #2
    Hallo!

    Das dürfte fast kaum machbar sein!

    1.) Transparenz kannst du nur mit gif Bildern machen, bei png weis ich das nicht aber bei jpg Bildern gaht das schon mal nicht!

    Hast du gif Bilder musst du die Tranzparenz ermitteln und der Rest müsste dann mit Mathe zu lösen Radienberechnung,aber da kommt noch das Problem du musst alle vier Ecken errechnen und die Punkte wie der Radius an jeder Ecke verlaufen soll!

    Aber ob das mit PHP so möglich ist kann ich dir nicht sagen,da fehlen mir die Kenntnisse. Aber das was ich geschrieben habe musste als Denkanstoß vieleicht schon reichen!

    mfg der litter
    Aus dem Dynamo Lande kommen wir. Trinken immer reichlich kühles Bier. Und dann sind wir alle voll, die Stimmung ist so toll. Aus dem Dynamo Lande kommen wir.
    [URL]http://www.lit-web.de[/URL]

    Kommentar


    • #3
      Klar, png kann Transparenz.

      Bau Dir doch eine Vorlage, dann kopierst Du Dir mit imagecopy die Eckbereiche heraus und setzt sie in ein Bild mit angepaßter Größe ein.

      Spricht eigentlich was dagegen, Stylesheets zu verwenden? Für CSS gibts jede Menge fertige Lösungen für dynamische Rund-Ecken-Buttons...
      [COLOR="#F5F5FF"]--[/COLOR]
      [COLOR="Gray"][SIZE="6"][FONT="Georgia"][B]^^ O.O[/B][/FONT] [/SIZE]
      „Emoticons machen einen Beitrag etwas freundlicher. Deine wirken zwar fachlich richtig sein, aber meist ziemlich uninteressant.
      [URL="http://www.php.de/javascript-ajax-und-mehr/107400-draggable-sorttable-setattribute.html#post788799"][B]Wenn man nur Text sieht, haben viele junge Entwickler keine interesse, diese stumpfen Texte zu lesen.“[/B][/URL][/COLOR]
      [COLOR="#F5F5FF"]
      --[/COLOR]

      Kommentar


      • #4
        Hallo Leute, vielen Dank für eure Antworten.

        Sorry das ich mich erst jetzt melde, aber ich freue mich wie ein kleines Kind, dass ich diese Klasse zu einem Abschluss gebracht habe.

        Wie nikosch77-new geschrieben hat, hab ich das mit imagecopy erledigt. Hab ein Bild mit den Extakten ausmaßen von dem Tumb erstellt, da drin gefüllte kreiße gemalt, dann 2 gefüllte rechtecke gemacht, die Farbe dann auf Transparent gesetzt und zum schluss kopiert.

        Das sieht dann so aus:


        Ich danke für eure Hilfe.

        @nikosch: Via Css wollte ich es nicht lösen, weil die Bilder Plattformunabhängig sein sollen. Heißt also, ich will die Bilder auch in Newslettern etc verwenden können.
        [B]Mfg Tomtaz[/B]
        [I]"Es soll jetzt diese Erfindung geben.... Kugel oder so heißt die. Ist so eine Art Suchmaschine..." [/I]:!::shock:

        Kommentar

        Lädt...
        X