ABA


"מדריך - עיגול פינות אוטומטית, בעזרת GD"
גירסת הדפסה        
קבוצות דיון בניית אתרים נושא #13230 מנהל    סגן המנהל    מפקח   Winner    צל"ש   מומחה  
אשכול מספר 13230
Kent Net
חבר מתאריך 18.3.02
2359 הודעות
   23:14   15.11.07   
אל הפורום  
  מדריך - עיגול פינות אוטומטית, בעזרת GD  
 
   פנו אליי וביקשו שאסביר איך עושים את זה.

זה מדריך די בסיסי ופשוט שמסביר איך ניתן ליצור אפקט של פינות מעוגלים על תמונות שגודלן ידוע מראש (!).
בוא נניח שאנחנו מנהלים אתר חדשות כמו NRG.
לכל ידיעה נעלה תמונה.
נצטרך לטפל קודם לכן בתמונות בעזרת GD כדי לשנות אותן לגודל שמוגדר מראש,
גם כדי לשמור על פורמט אתר קבוע וגם כדי להשתמש בעיגול תמונות שבמדריך.

נניח והעלנו תמונה,
הנה היא:
http://rotter.name/User_files/nor/473cb2ec2c5d7fa5.jpg
נקרא לה bg.png

כל מה שנצטרך לעשות זה להלביש על התמונה את המסגרת הבאה:
http://rotter.name/User_files/nor/473cb3572e8558f3.png
נקרא לה overlay.png

תעשו CTRL A ושימו לב איך התמונה בנוייה, (שימרו אותה!).
PNG - המרכז שקוף - בצדדים "חצאי עיגולים" לבנים.

הלבשה של שתי התמונות האלו אחת על השנייה תוביל ליצירת אפקט של פינות מעוגלים.

בוא נתחיל:


$background = imagecreatefromjpeg('bbg.jpg');
$overlay = imagecreatefrompng('overlay.png');

נגדיר את background בתור תמונה מתוך JPEG (זוהי התמונה המקורית שלנו),
ואת overlay כתמונה מ PNG - זוהי תמונת השכבה השנייה שלנו.


imagealphablending($background, true);

כדי למנוע תקלות לא רצויות, ניתן לתמונות הרקע
ALPHABLENDING -
(http://il.php.net/manual/en/function.imagealphablending.php)

כעת נאחד את שתי התמונות לאחת,
נשתמש בפונקציה הבאה:


imagecopy($background, $overlay,0, 0, 0, 0,309, 164);

כאן בעצם "איחדנו" את הרקע יחד עם שכבת ה overlay ושמרנו את השינויים בחזרה על המשתנה background.
שימו לב לרוחב ולאורך של התמונה כחלק מהנתונים בסוף המחרוזת.

כעת כל מה שנותר לעשות זה לשמור את התמונה ולמחוק עקבות בשרת.

imagejpeg($background, "newimage.jpg");

imagedestroy($background);
imagedestroy($overlay);

את התוצאה יהיה ניתן לראות בשרת תחת הקובץ newimage.jpg.
אני מאמין שתצליחו "לגלות" לבד איך משנים את השם או איך מציגים את הקובץ ישר בתור תמונה.

http://rotter.name/User_files/nor/473cb6953dfc6e28.jpg

שיהיה בכיף

רוצים גם אתם חתימת פז"ם ? https://.net/


                                שתף        
מכתב זה והנלווה אליו, על אחריות ועל דעת הכותב בלבד

  האשכול     מחבר     תאריך כתיבה     מספר  
  תודה רבה לך, אני אעבור עליו עוד מעט :) שאלה קטנה: Tom_l  15.11.07 23:21 1
     בעיקרון צריך ידע בפוטושופ Kent Net 15.11.07 23:36 3
         מכתב Tom_l  16.11.07 09:05 4
             יש בפוטושופ אפשרות ליצור מלבן עם פינות מעוגלות... MeToR 16.11.07 10:10 5
  תודה רבה! asco88  15.11.07 23:27 2
  יפה גל עשיתי בדיוק ככה רק עם imagecopymerge:) akoka 16.11.07 11:02 6
  up Kent Net 18.11.07 14:54 7
  יפה יפה , הצעה לייעול Morishani 18.11.07 16:57 8
  סחטיין עליך, תודה SiLeNt NoAm 18.11.07 19:06 9
  כל הכבוד איש ! :) אחלה מדריך אוהד  19.11.07 14:44 10

       
Tom_l 
חבר מתאריך 1.1.10
1696 הודעות
   23:21   15.11.07   
אל הפורום  
  1. תודה רבה לך, אני אעבור עליו עוד מעט :) שאלה קטנה:  
בתגובה להודעה מספר 0
 
   ערכתי לאחרונה בתאריך 15.11.07 בשעה 23:26 בברכה, Tom_l
 
איך עשית את התמונה עם הפינות העגולים?
איך אני יוצר כזו תמונה?


תודה רבה.


                                                         (ניהול: מחק תגובה)
מכתב זה והנלווה אליו, על אחריות ועל דעת הכותב בלבד
Kent Net
חבר מתאריך 18.3.02
2359 הודעות
   23:36   15.11.07   
אל הפורום  
  3. בעיקרון צריך ידע בפוטושופ  
בתגובה להודעה מספר 1
 
   אם אתה מסתבך יותר מדי פשוט תיצור תמונה חדשה בגדלים שאתה צריך,
עם רקע שקוף.
קח את התמונה שלי, תחתוך את הפינות ותדביק במקומות הנכונים.

מקסימום תבקש בפורום גרפיקה אני בטוח שמישהו ישמח לעזור לך.

רוצים גם אתם חתימת פז"ם ? https://.net/


                                                         (ניהול: מחק תגובה)
מכתב זה והנלווה אליו, על אחריות ועל דעת הכותב בלבד
Tom_l 
חבר מתאריך 1.1.10
1696 הודעות
   09:05   16.11.07   
אל הפורום  
  4. מכתב  
בתגובה להודעה מספר 3
 
   יש לי ידע בסיסי בפוטושופ.
אבל איך אני עושה את הפינות?
זה נראה לי מיותר לחתוך את הפינות בתמונה שלך ולהדביק אותם על התמונה שלי, זה סתם להסתבך...

אין איזו אפשרות שעושה את זה?


                                                         (ניהול: מחק תגובה)
מכתב זה והנלווה אליו, על אחריות ועל דעת הכותב בלבד
MeToR
חבר מתאריך 26.1.07
11 הודעות
   10:10   16.11.07   
אל הפורום  
  5. יש בפוטושופ אפשרות ליצור מלבן עם פינות מעוגלות...  
בתגובה להודעה מספר 4
 
   בצורות פשוט תבחר את זה...


                                                         (ניהול: מחק תגובה)
מכתב זה והנלווה אליו, על אחריות ועל דעת הכותב בלבד
asco88 
חבר מתאריך 17.6.04
26757 הודעות
   23:27   15.11.07   
אל הפורום  
  2. תודה רבה!  
בתגובה להודעה מספר 0
 


                                                         (ניהול: מחק תגובה)
מכתב זה והנלווה אליו, על אחריות ועל דעת הכותב בלבד
akoka

   11:02   16.11.07   
אל הפורום  
  6. יפה גל עשיתי בדיוק ככה רק עם imagecopymerge:)  
בתגובה להודעה מספר 0
 
  


                                                         (ניהול: מחק תגובה)
מכתב זה והנלווה אליו, על אחריות ועל דעת הכותב בלבד
Kent Net
חבר מתאריך 18.3.02
2359 הודעות
   14:54   18.11.07   
אל הפורום  
  7. up  
בתגובה להודעה מספר 0
 
  

רוצים גם אתם חתימת פז"ם ? https://.net/


                                                         (ניהול: מחק תגובה)
מכתב זה והנלווה אליו, על אחריות ועל דעת הכותב בלבד
Morishani

   16:57   18.11.07   
אל הפורום  
  8. יפה יפה , הצעה לייעול  
בתגובה להודעה מספר 0
 
   תבדוק אם אפשר "להרוס" את התמונה של הoverlay לפני שמציגים את התמונה של הbackground, ישר אחרי השורה של הimagecopy.


                                                         (ניהול: מחק תגובה)
מכתב זה והנלווה אליו, על אחריות ועל דעת הכותב בלבד
SiLeNt NoAm
חבר מתאריך 26.5.02
1693 הודעות
   19:06   18.11.07   
אל הפורום  
  9. סחטיין עליך, תודה  
בתגובה להודעה מספר 0
 





בדיחות | משחקים |
הורדות |
סרטונים


                                                         (ניהול: מחק תגובה)
מכתב זה והנלווה אליו, על אחריות ועל דעת הכותב בלבד
אוהד 
חבר מתאריך 30.8.04
34185 הודעות, 1 פידבק
   14:44   19.11.07   
אל הפורום  
  10. כל הכבוד איש ! :) אחלה מדריך  
בתגובה להודעה מספר 0
 
  



                                                         (ניהול: מחק תגובה)
מכתב זה והנלווה אליו, על אחריות ועל דעת הכותב בלבד

תגובה מהירה  למכתב מספר: 
 
___________________________________________________________________

___________________________________________________________________
למנהלים:  נעל | תייק בארכיון | מחק | העבר לפורום אחר | מחק תגובות | עגן אשכול
       



© כל הזכויות שמורות ל-רוטר.נט בע"מ rotter.net