วิธีการสร้างเอฟเฟกต์กระจกเบลอ / ฝ้าแบบไม่ทำลายและนำกลับมาใช้ซ้ำได้?

ฉันจะสร้างพื้นหลังเบลอแบบทั่วไปที่สามารถใช้กับภาพหลาย ๆ ภาพคล้ายกับตัวอย่างด้านล่างได้อย่างไร

ฉันต้องการกระจกฝ้าสีขาวกำลังมองหา pngที่ฉันสามารถตั้งค่าให้ใช้เลเยอร์เหนือรูปภาพทั่วไปเพื่อให้พวกเขามีลักษณะเป็นกระจกฝ้า (เหมือนคุณเกือบจะทำอะไรออกมาข้างหลังอาจจะมีบางสี)

ตัวอย่าง:

^{คลิกที่ภาพเพื่อดูความละเอียดเต็ม}

อาจเป็นพื้นหลังสีขาวที่มีพื้นผิว (เนื้อหยาบ) จากนั้นเกาส์เซียนเบลอแล้วใช้เป็นเลเยอร์เหนือรูปภาพของฉันทั้งหมด

ฉันรู้ว่าลิงก์ที่ฉันโพสต์ด้านบนอาจเป็นเพียงภาพเบลอ แต่ฉันต้องการเลเยอร์ที่สามารถนำกลับมาใช้ในโครงการ iOS ได้ วิธีนี้จะสามารถใช้เลเยอร์มุมมองเหนือส่วนต่าง ๆ ของภาพและทำให้ภาพที่อยู่ด้านล่างเบลอ บางทีฉันไม่ควรใช้การเบลอเป็นคำที่นี่ ฉันกำลังมองหากระจกฝ้า

สิ่งที่ฉันพยายามทำกับภาพนี้คือการนำเข้าไปในแอพ iOS ของฉันใช้เป็นพื้นหลังในการดู จากนั้นเมื่อมุมมองนี้อยู่เหนือมุมมองอื่น ๆ (มุมมองแผนที่ภาพถ่าย ฯลฯ ... ) มุมมองเหล่านั้นทั้งหมดจะมีน้ำค้างแข็ง ฉันกำลังพยายามสร้างเอฟเฟกต์ของภาพนี้จาก iOS 7 และฉันไม่ต้องการใช้คุณลักษณะการออกแบบ iOS 7 ใหม่เพราะผู้ใช้ส่วนใหญ่ของฉันยังคงใช้ iOS 5 อยู่ และไม่ฉันไม่ต้องการบังคับให้อัพเกรด

คุณไม่สามารถวางภาพ 'พร่ามัว' ที่ซ้อนทับภาพสุ่มที่อยู่ด้านหลัง เอฟเฟกต์เบลอต้องสุ่มภาพด้านหลังเพื่อเคลื่อนย้าย / กระจายพิกเซลดังนั้นจึงจำเป็นต้องนำไปใช้ที่นั่น

อย่างไรก็ตามคุณสามารถสร้างพื้นผิวที่เป็นทราย / เป็นเม็ดและใช้เป็นชั้นทวีคูณเพื่อให้ได้รูปลักษณ์ที่เป็นเม็ดเล็ก ๆ

อัปเดต - ตามที่ดีเร็กแนะนำในคำตอบอื่นคุณสามารถสร้างความเบลอแบบไม่ทำลายได้โดยแปลงเลเยอร์ภาพของคุณเป็นวัตถุอัจฉริยะจากนั้นนำความเบลอมาใช้ จากนั้นคุณสามารถเข้าสู่วัตถุอัจฉริยะและแก้ไขสิ่งที่เป็นอิสระจากความพร่ามัว

ดูภาพที่สองที่คุณให้ไว้บางสิ่งเช่นนี้ไม่สามารถทำได้ด้วยการซ้อนทับ PNG ที่ทำอย่างแน่นอนทางโปรแกรมในบางวิธีและไม่ได้มีการซ้อนทับ PNG ฉันลองคำแนะนำอื่น ๆ ที่โพสต์ไว้ที่นี่แล้วไม่มีใครเข้ามาใกล้ (แต่คุณอาจจะโชคดีกว่า)

นี้เป็นจริงที่เกิดนอกของความต้องการของคุณ แต่นี้ไม่ได้ที่จะทำได้ด้วยการวางซ้อน? ฉันไม่แน่ใจว่าคุณจะได้รับผลกระทบที่คุณคาดหวังว่าจะบรรลุโดยใช้วิธีการแบบนั้น หากคุณมีความสามารถฉันจะทำสิ่งนี้แทนโดยทางโปรแกรม

ฉันไม่เข้าใจวิธีการตั้งค่าแอปพลิเคชันของคุณ แต่วิธีหนึ่งที่คุณสามารถทำได้คือใช้ตัวกรอง CSS3:

.blurred {
  filter: blur(2px);
  -webkit-filter: blur(2px);
}

[หมายเหตุเพื่อความชัดเจน: กระบวนการนี้เป็นภาพเบื้องหน้าของผลิตภัณฑ์ที่มีหน้ากากอัลฟาและภาพพื้นหลังซึ่งเบลอโดยใช้ตัวกรอง CSS]

ก่อน

หลังจาก

^{เครดิตรูปภาพ: Philip Leara}

คุณสามารถตรวจสอบตัวอย่างสดของที่นี่

ในอนาคตนี้อาจจะทำให้ง่ายมากที่ใช้นำเสนอbackdrop-filterรูปแบบ CSS แต่ปัจจุบันสนับสนุนสำหรับเรื่องนี้คือติดกับที่ไม่มีอยู่จริง

อีกทางเลือกหนึ่งคือการสร้างวัตถุอัจฉริยะและใช้การเบลอและเอฟเฟกต์ของคุณกับวัตถุอัจฉริยะ การทำเช่นนี้จะช่วยให้คุณเปิดวัตถุอัจฉริยะและเปลี่ยนสิ่งที่อยู่ภายใน

--- แก้ไข ---

เนื่องจากฉันโพสต์คำตอบข้างต้นแล้วคำถามจึงได้รับการแก้ไขและเปลี่ยนแปลงเล็กน้อย คำขอคือการทำให้เบลอในแอป iOS ฉันขอแนะนำให้ทำเบลอด้วยรหัสเพื่อที่ว่ามันจะมีผลต่อภาพที่คุณต้องการ

private static Bitmap Blur(Bitmap image, Int32 blurSize)
{
    return Blur(image, new Rectangle(0, 0, image.Width, image.Height), blurSize);
}

ข้อมูลเพิ่มเติมเกี่ยวกับที่นี่: http://notes.ericwillis.com/2009/10/blur-an-image-with-csharp/

มีตัวกรองที่ดีใน Dribble เกี่ยวกับวิธีทำให้เบลอใน Photoshop บางทีสิ่งเหล่านี้อาจเป็นประโยชน์สำหรับคุณเช่นกัน ฉันชอบวิธีที่ไม่ทำลายเพื่อรับผลกระทบโดยเฉพาะอย่างยิ่ง ฉันรู้ว่ามีบางอย่างเกี่ยวกับเรื่องนี้ แต่นี่คือลิงค์:

http://dribbble.com/shots/1210251-Live-Blur-Free-PSD

http://dribbble.com/shots/1109921-iOS7-Blur-Photoshop-Action

หากยังคงมีความจำเป็นฉันกำลังพยายามทำให้ได้ผลเหมือนเดิมและทำไม่ได้

ฉันไม่ได้มีปลั๊กอินที่เรียกว่า html2canvas และ stackBlur ซึ่งผมพบว่ามันนี่: http://jsfiddle.net/WtQjY/201/

ฉันไม่ใช่ผู้เขียนปลั๊กอิน และนี่เป็นเพียงตัวอย่างของรหัส ฉันเปลี่ยนให้ง่ายขึ้นและเร็วขึ้น:

.เบลอ{
    -webkit-filter: เบลอ (7px);
-moz-filter: เบลอ (7px);
-o-filter: เบลอ (7px);
-ms-filter: เบลอ (7px);
ตัวกรอง: เบลอ (7px);

}

//////////////////////////////////
// รวมไลบรารี jquery
// jQuery
$ (เอกสาร) .ready ({
$ ( '# YourButton'). คลิก ({

$ ( '# YourContainer') toggleClass ( 'เบลอ').

});
});

มันยังช้ามาก แต่ก็ใช้งานได้

ดังนั้นฉันจึงสร้างสคริปต์นี้ในเวอร์ชันของฉันเองฉันคิดว่าฉันจะแบ่งปัน ฉันสร้างภาพพื้นหลังสองภาพและแนบหนึ่งในนั้นให้กับ div ของเด็กจากนั้นภาพที่คมชัดและชัดเจนไปยังพื้นหลังหลัก เพียงแค่ตั้งค่าพื้นหลังของวัตถุทั้งสองให้คงที่และอยู่ตรงกลางและพวกมันจะจับคู่กัน

นี่คือตัวอย่าง: http://www.palandforsale.us/frosted-glass/

หากฉันเข้าใจคำถามของคุณถูกต้องฉันไม่คิดว่าคุณจะทำได้ 'Blur' เป็นการดำเนินการที่ดำเนินการในซอฟต์แวร์แต่ละชิ้นในแบบของตัวเอง วิธีร่างใช้การเบลออาจเป็นวิธีที่แตกต่างจาก Photoshop หรือ Google Chrome

ดังนั้นคุณไม่สามารถส่งออกภาพด้วย 'เบลอ' เบลอมีปฏิสัมพันธ์กับสิ่งที่อยู่ข้างหลังเสมอและไม่สามารถส่งออกจากแอปพลิเคชันที่คุณสร้างขึ้นมาได้

1. สร้างเลเยอร์สีเทา 50% เหนือเลเยอร์ที่คุณต้องการสร้างเลเยอร์เบลอและฝ้า
2. เติมด้วยเสียงจำนวนซึ่งขึ้นอยู่กับความต้องการของคุณ
3. เบลอด้วย Gaussian blur ตามที่คุณต้องการ
4. เหนือชั้นนี้คุณสามารถเพิ่มเลเยอร์เส้นโค้งและปรับค่าสีขาวและสีดำได้โดยการดึงส่วนปลายสีขาวหรือผลักดันส่วนปลายสีดำของชั้นโค้ง

สองเลเยอร์เหล่านี้ควรให้ความเย็นจัดและเบลอ คำสั่งของทั้งสองเลเยอร์สามารถเปลี่ยนแปลงได้

สร้างการกระทำที่ซ้ำกับภาพและใช้การเบลอแบบเกาส์ นี่เป็นวิธี PS เดียวที่ฉันเชื่อ