cách tạo hiệu ứng mờ ảo với phản ứng gốc?

Question

làm cách nào để tạo hiệu ứng mờ với phản ứng gốc? như 'background-image'

và tôi muốn chuyển sang hiệu ứng 'mờ' và 'không', 'không' có nghĩa là không có tác dụng làm mờ

Answer 1

Bây giờ bạn có thể làm điều này mà không cần bất kỳ thư viện sử dụng prop: blurRadius.

ví dụ

<Image 
    style={styles.img} 
    resizeMode='cover' 
    source={imgSrc} 
    blurRadius={1} 
/> 

Giải thích: số (1) có nghĩa là số lượng mờ bạn muốn áp dụng vào hình ảnh, số càng cao, các blurrier hình ảnh.

Rất tiếc, tính năng này chưa hoạt động trên Android (RN 0.40.0). Tuy nhiên, nó có thể hữu ích cho những người chỉ tìm kiếm giải pháp iOS.

Chỉnh sửa: Có vẻ như bạn đang làm việc trên Android ngay bây giờ.

Answer 2

Hãy thử thư viện mờ này.

phụ thuộc :: biên dịch 'jp.wasabeef: mờ: 2.0.2'

https://github.com/wasabeef/Blurry

Answer 3

bạn có thể sử dụng thư viện này để có được hiệu quả mong muốn. https://github.com/react-native-fellowship/react-native-blur

Answer 4

tôi thấy NPM này trông rất tốt react-native-blur

usage

Answer 5

Install react-native-blur:

npm install react-native-blur 

import BlurView from 'react-native-blur'; 

... 
<BlurView blurType="light" style={styles.blur}> 
... 

Answer 6

Nếu bạn đã tạo ứng dụng của mình bằng CRNA, hãy sử dụng hội chợ. Bạn có thể sử dụng BlurView từ hội chợ.

import {BlurView} from 'expo';

Có hai đạo cụ để kiểm soát hiệu ứng mờ.

tint có giá trị chuỗi là light, default hoặc dark. và intensity trong đó khoảng từ 1 to 100