Image Gallery with Flex, PHP and MySQL

There are many Image Galleries available on web, but time to time I want to make one of me own. This time I used Flex, PHP and MySQL. I found one excellent Flex Component from Doug McCune - CoverFlow Component and created my Image Gallery Menu with it.

Image Gallery Menu

Selected gallery is displayed with own state in Flex, thumbnails and image information are displayed in bottom of the screen.

Image Gallery Pictures

New galleries can be uploaded to server with Admin tool. Admin tool sends gallery information to PHP which adds gallery information to MySQL table. After gallery is initialized, all selected pictures will be send to server and thumbnails will be generated with PHP.

Image Gallery Admin

Here are sources and installation instructions:

1. MySQL tables
- create following tables
- if you change table names, edit PHP-files also

mysql> describe ptm_imagegallery;
+-------------+--------------+------+-----+---------+----------------+
| Field       | Type         | Null | Key | Default | Extra          |
+-------------+--------------+------+-----+---------+----------------+
| gallery_ID  | int(11)      | NO   | PRI | NULL    | auto_increment |
| name        | varchar(50)  | YES  |     | NULL    |                |
| description | varchar(100) | YES  |     | NULL    |                |
| date        | date         | YES  |     | NULL    |                |
| password    | varchar(45)  | NO   |     |         |                |
| count       | int(11)      | YES  |     | NULL    |                |
| size        | int(11)      | YES  |     | NULL    |                |
+-------------+--------------+------+-----+---------+----------------+

mysql> describe ptm_imagegalleryimages;
+------------+-------------+------+-----+---------+----------------+
| Field      | Type        | Null | Key | Default | Extra          |
+------------+-------------+------+-----+---------+----------------+
| image_ID   | int(11)     | NO   | PRI | NULL    | auto_increment |
| gallery_ID | int(11)     | YES  |     | NULL    |                |
| filename   | varchar(30) | YES  |     | NULL    |                |
| date       | date        | YES  |     | NULL    |                |
| width      | int(11)     | YES  |     | NULL    |                |
| height     | int(11)     | YES  |     | NULL    |                |
| views      | int(11)     | YES  |     | NULL    |                |
+------------+-------------+------+-----+---------+----------------+

2. PHP files
- copy PHP files to your server and edit needed MySQL variables

3. Flex project
- edit and compile Flex sources, use your own domain and path's

You can test my Image Gallery here:

PTM Image Gallery

32 thoughts on “Image Gallery with Flex, PHP and MySQL

  1. Tony

    Hi ptm,
    you did a wonderful job,i’ve learned a lot from your work.
    thanks for your share!
    Best regards.
    Tony

  2. Kacey

    Hi there,

    I really enjoy reading your blog, its just amazing what can be done with flex these days. I have a question that I’d really love your help with though. I need someone who can design an interface like the one you outline in your post, I know you probably aren’t interested in “jobs” anymore, but do you know anyone who would be? Up and coming talented proteges maybe?? Your input would be VERY much appreciated!

    Thanks,
    Kacey

  3. ptm Post author

    Kacey,

    thank your very much about your nice words but I am developer not designer. Real designers can do really really nicer graphics and layout that I can do – I am just testing things and give sources to community. But look and contact for example Vivek at http://blog.i2fly.com/ to get nice designs.

    Pasi

  4. Doug

    I can’t view the gallery demo because the gallery is password protected. Can you please open it up?

    Thx
    Doug

  5. jesus

    Hi, im using your gallery, but when i try to upload the files ,it only makes the dB entry, and the images doesnt upload to my local, also it doesnt create the thumbs, an the info of time date and other are not stored to de dB, could you help me please, is the source complete? i use the same source and i tryied everything but i dont get it to work.. the php files have relative, and the flex also… what im i doing wrong?

  6. ptm Post author

    jesus,

    yes the sources are complete and fully working – I am using those all the time to upload images to my gallery. Please, check that galleries folder that contains image folders has full write access.

    Pasi

  7. Jesus

    the folders have 0777, also tryed with 0755, with no results in my local, also tryed to put the proyect on my website, same results.

    But let me tell you that you did an excellent work here i have read your code up and down like 30 times, really clean flex, and nice php. i know that my experience was not good, because of something that im missing, but i really learn a lot with your gallery.

    U Rock!!!

  8. ptm Post author

    Jesus,

    I uploaded my latest San Francisco MAX 2008 pictures and example worked as it should. So there must some problems in your installation.

    Pasi

  9. cbruno

    Nice Gallery

    I tried 2 use the gallery but getting no images thumbs en you dont have a .sql file make the tables by my self but it dont work good

  10. ptm Post author

    cbruno,

    sorry I have only .txt file which shows mysql tables. Let me know if you dont get this working and I will get .sql tables for you.

    Pasi

  11. Josephus

    Hey you are a god !!! thank you so much I did learn a lot of your aplication, I am from México and now I’m your fan jaja

  12. Axxl

    Same symptoms as jesus. Fails at upload. Nothing is written to ptm_imagegalleryimages. Wonderinging if it’s a server configuration issue. Is AMFPHP required?

  13. ptm Post author

    Axxl and jesus,

    how big are your image file sizes? By default PHP can handle about 2-4MB, it depends server PHP configuration. Can you test smaller files or contact your system admin to know how big files you can upload.

    This example works without AMFPHP.

    Pasi

  14. Marco

    Hello ptm,
    first let me say thanky you for this very good work.

    Please is it possible to change ImageGallery.mxml from an application to a canvas? I would like to import your gallery into an existing application.

    I have try to change it from application to canvas, that works. But in some other mxml files are defined pathes with Application.application… and i can´t solve it to get it working.

    Please would you be so nice and help me?

    Thank´s in advance!

    Regards,
    Marco

  15. ptm Post author

    Marco,

    thanks about your feedback. Sorry I am now a little bit occupied, but I think it should be work with Canvas also. All Application.application can be as they are now, but in those functions you should refer to used canvas.

    I hope that I will have time to make another example here for you someday but now I am a quite busy with my other works in a few weeks. But let me know if you get it working.

    Pasi

  16. jesus

    Sorry for the late answer, but from the beggining my images were lower than 700 kbs each, also changed de folder settings and server.

    Man U ROCK!!!

    Good vibes here in MX

  17. tate

    ptm,

    I’m having the exact same issues still as Jesus. Did anyone ever determine what was going on?

    Thanks so much for the effort!

    -tate

  18. tate

    Jesus,

    Try making sure that your server is using PHP version 5.x and NOT 4.x. I changed mine to 5.x and now it’s working….let me know if that works.

    -Tate

  19. Alami

    i checked the online demo and its one of the coolest flex galleries ever!!

    i also read all the above comments and clarifications ( and did the same)

    but i need your help

    Some problems im facing , btw

    - Thumbnails Creation fail
    - images upload to dir(i checked), but the gallery fails to render
    - lotsa errors

  20. Oskar

    Hello Everybody!

    I had the same problem with this example but I found a solution. I analized the php files (expecially uploadFile.php) and I had problems with EXIF library. On my web server php_exif.dll was unload so I changed the option i php.ini. Just turn it on.
    After this modyfication everything is working very good.

    ptm, I would like to congratulate You this example. Nice job. Thx.

    Oskar

  21. villas

    I cant acess admin area.
    When click on admin link, nothing happens. Can you pleas tell us where are all files (folders and files on a webserver) please?

  22. ptm Post author

    villas,

    unzip php.zip files to your server and use right link in mxml file. Check also adminPassword.php to store your password.

    Pasi

  23. Nico

    Hey there… That one was exactly what I was searching for… Wohoo!

    There seem to be some bugs, and a function that converts filenames to url-friendly ones before the upload especially in european countries seem to be essential.
    but i really like this example as a very solid base.

    Now, the most hardest issue to find out and correct was that you need to place a folder called “galleries” near the php-files and set this one chmod777 (or 755) because this one seem not to be created at start.

    That was what caused an error before creating the first gallery.
    But – I used Flexdebug and at the end it seems to be running. I don’t now why one of the uploaded galleries throws an exception right now, but I’ll be after it until its finished.

    Thank you very much Pasi for your appreciated work!

    NICO, Switzerland

  24. Rudy

    This is a very nice tool you have created. Kudos to you.
    I am a student and as part of one of my coming projects, I was intent in creating a dynamic image gallery similar to what you have created here. However, I am still exploring doing it with longblob in the database.
    I am impressed, however, with how smooth your gallery works.

    I will be setting up my project following your excellent example, however, I want to ask you if you have created a gallery utilizing the blob type in the database instead, and what are your feelings and experience in that respect?

    I have created and uploaded images to my local database utilizing the blob type, however, I am having the toughest time getting flex 4 to render the image data. All other data is not a problem, though.

    Thanks again for your inspiration and hard work.

    Rudy

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>