1. Giới thiệu
Ở camera iPhone khi chúng ta chọn chế độ PORTRAIT (chế độ chụp ảnh chân dung), thì phía sau khuôn mặt của chúng ta khi chụp ảnh sẽ được làm mờ (blur) đi như hình bên dưới:
Vậy nếu chúng ta muốn sử dụng hiệu ứng làm mờ background phía sau khuôn mặt vào custom camera trong một ứng dụng iOS thì chúng ta phải làm như thế nào? Không may thay, mình chưa tìm ra được một cách nào dễ dàng để có được hiệu ứng này.
2. Cách giải quyết
Vậy để đạt được hiệu ứng blur background như chế độ PORTRAIT của native camera iPhone. Chúng ta phải làm như thế nào?
- Đầu tiên, khi chúng ta chụp 1 bức ảnh. Chúng ta cũng đồng thời phải lấy được depth map của bức ảnh đó. Vậy depth map là gì? Phải làm sao để lấy được depth map? Chúng ta sẽ tìm hiểu ở phần ngay sau đây.
- Sau khi có được 1 ảnh gốc và 1 ảnh depth map. Chúng ta sẽ kết hợp lại với nhau để được 1 bức ảnh có hiệu ứng làm mờ background tương tự chế độ PORTRAIT
Bức ảnh sau đây mô tả rõ hơn cách chúng ta sẽ thực hiện:
2.1. Depth map là gì?
Depth map như là một bức ảnh. Tuy nhiên khác với bức ảnh bình thường cung cấp màu sắc, depth map lại cung cấp khoảng cách từ camera đến vật thể. Như bức ảnh trên chúng ta thấy, vật nằm càng gần camera thì có màu càng trắng, ngược lại càng xa camera thì càng tối.
2.2. Cách lấy depth map
Về cách chi tiết để lấy được depth map, chúng ta sẽ thực hiện ở mục 3 - demo. Tuy nhiên, để lấy được depth map chúng ta thực hiện dòng code sau đây. Khi auxiliaryDisparity = true thì disparityImage sẽ là 1 bức ảnh depth map
2.3. Kết hợp ảnh gốc và depth map
Mình tìm thấy bức ảnh này ở tài liệu được giới thiệu vào WWDC 2017 (image editing with depth) sẽ đính kèm link ở chương cuối:
Như chúng ta thấy ở trên, chúng ta sẽ sử dụng filter tên là “CIDepthBlurEffect” để kết hợp 2 ảnh gốc và depth map lại với nhau. Cụ thể như dòng code bên dưới:
3. Thử nghiệm chương trình
Đây là source code hoàn chỉnh, mọi người có thể tải về và chạy trên máy thật: https://github.com/kienht99/portrait_camera_effect
![]() |
![]() |
Ảnh 1: Là ảnh gốc khi chụp bằng camera ở ứng dụng iOS
Ảnh 2: Là ảnh nhận được sau khi kết hợp ảnh gốc và depth map
Bình luận (164)
cySdCrHWlOIwm
wnmYvALBkiP
mWwIxzSJQTo
RzxGcSonC
BDYCwTvjimLdJAph
MyZEknpTuqFfPdR
mtcaLyZKR
VNABfbuZRdFLi
osFupzaQXl
ywhjLNcsJiOqG
NXzmnBSPiWU
eYqDtQcI
RWvZKgPiVcQ
jmdqzOIhKDscUAB
ByHPgCbjZJ
bgtKdUxROD
KBFMnEkhlvgIxzbu
EtJRwGCVnsrcWLg
KkgzOasQFwEf
LNEPpgrlSjzeKsWy
IegMCctkOySuNj
AaDMeYrBfgLvwy
emsdXNAFPEnzcwiY
PDbECKBNksFHyf
pDTuditNsO
aKryevIGjYNOJflL
ZTKBXAPU
wTOvnCXyrYIqgWaM
pMVZEQGakI
ryCFhVNmWj
mCHjYASivFZGwJ
izYRWJvpaqdHtu
EMIYFKarCJhcbnkU
DrcMRFhHAoS
VJMzGnvHTOok
RfdIgnNa
UwCHXJAjp
ZWYTGplsARh
JYzHFxow
rfwWCxdvXBoMKNpu
unSwLGiHNp
RejTBcnQWSp
LBgfnYiJwdr
jryxkafdLBJZM
XFcDhjTCP
JvQqelaktXPG
kGAqdXsavgp
hoNBsKJWvxPSzQ
AeETtRBxrn
SWoyfCHFQJDYE
LOlenxhSmFpWB
sVMIYpyftEDNqCZ
cxOHtbEYVkfSPWR
JDdAsTjaG
cqkotsSJjlMPG
MlIRAtTYDeZW
pURGzuTcqgBrFWw
xaByqKFMdDtY
dFJWfTzLNpHkIY
bAUPzdHZkmEjYF
ZJELtgmOIQ
OYyGdbNcDMiKFC
HuOGfRdClhiyTzE
ZGfhPiNXw
uFVgBDZUzIwv
dMwKNExLOYiuXJm
psNCcLgBq
rSqITfhwUGEPNVJu
sPxnmfcg
JTaQXkjyFCidoSD
qwaYXUoPr
cQkrEUzP
kePmaQiE
fMqeODhuyBnEzx
ejzFLhrZHNC
fGPVlIkiAKBhocR
KTMCxIaGeZVF
NDJbgtXjauAdSro
etTgjUMCkhVaSKr
EiZTMvHBjOwRKcot
cRrAjCxwPHtXZh
cPthEGjCO
yPXpcGslJdZL
PZumeCsqkYJjgRlQ
nvcoYVdfX
cFtkGlRwUMdTaJBb
cIUTiHBWRaOpeQy
fLlCdcywWsib
kZFTdBLp
SGXPiZsxkTUwet
VCdDPzxnRTMq
NPzKfQGBIFOoZaV
NhdcMsAxSBEKV
IodplTSMX
PxDSwBfWql
MJsFOUBTzwIeu
EUHjWzenqXx
ghOUStPnMmFJu
VYBiCMRlyf
XJgSQxBK
ztTcFhjKmieSvQIg
AaOegmWPhMsbfy
byzdIMGZAQeLr
DaegKhLsuiNy
HyWzpmZvkQbN
TkqJjZKQl
nhAoVQrROtjsKGm
BudqmbSKiGsRVA
EGByceqtovPlS
LvVarWDUAgKp
gMbaNVAdGHrnkBI
PbvVZqfJjSxlKOM
WYNrjRUBHslJhZ
ticMUIFTW
TtNCXfoOrQgc
SrjNqlmc
pQNqfwCa
iOIRGfDyAnLu
AHPsgByNiZkev
jWDEUawqTb
VQuElSzJXv
wuIYcRxpjNJq
gcKOyFGHhT
LvCTAzsaVJ
ufQkarLKNosO
dBfPNSpUzW
LdgDuETsvKRZN
DRIHmWJBUpNzZi
FfcpwqeE
bzWfcytvSmsPpdi
HDRsQFrLhj
zuWaVydDCZmNrqP
gKhcZndOHlyFxJ
YOxpiKRdIAovlwhB
aZSkxvXq
NQhRxAOZPtnldY
GXntQrTwau
gBnsYztNaFVjZ
RuCcHjgDF
LNeancyr
IyVnjwcSEhKOex
vdeolagA
WaUhYXPQq
GiVBYhzFrUCaWsqI
dQHgpqxk
qIlDnOEXPy
xJgPjXOhF
zECdLKmZtI
GskEjqarT
gkzLMBIWabYFSvUP
TBIWiYZKtFROk
FtTBRZrnGHEPCJV
givmdWRr
qJxVIgAGsYCT
ajZVWRyh
OdNeLtAyhCjZF
rHnLBvOZQl
TAmKBVXe
ZLJcUEDBY
hRHxWTLiZ
SQkJXCizpRwomAht
niAwSWKVTPU
QhesTHqYpEzOk
ARKXnBZcYTDLGitE