2016-05-10 6 views

答えて

34

今、あなたは小道具を使用して任意のライブラリせずにこれを行うことができます。blurRadius

例えば

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

説明:数は、(1)高い数、ぼやけた画像あなたがイメージに適用するぼかしの量を意味します。

残念ながら、これはAndroidではまだ動作しません(RN 0.40.0)。それにもかかわらず、誰がiOSソリューションを探しているのかは誰にでも分かります。

編集:これはAndroid上で動作しているようです。

+0

ありがとう、私は試してみましょう! –

+4

android on work now –

+0

RN 0.46.4現在、これはアンドロイド(API 19)で動作しました。 –

0

このぼやけライブラリを試してみてくださいを意味しません。

依存関係::コンパイル 'jp.wasabeef:ぼやけ:2.0.2' を

https://github.com/wasabeef/Blurry

+0

はあなたに感謝の範囲intensityが、ノーサポートのiOS –

+0

1)http://code.tutsplus.com/tutorials/adding-blur-effects-on-ios--cms-21488 2)HTTPS ://github.com/nicklockwood/FXBlurView このリンクはあなたに役立ちます – anonymous

2

が見つかりました:

npm install react-native-blur 

import BlurView from 'react-native-blur'; 

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

import {BlurView} from 'react-native-blur'; –

+0

はiosで動作しません.. – b3da

1

CRNAを使用してアプリを作成した場合、つまりexpoを使用した場合。あなたは、博覧会からのBlurViewを使用することができます。

import {BlurView} from 'expo';

これは、ぼかし効果を制御するために2つの小道具を得ました。

tint文字列の値がlight,default、またはdarkの場合です。 と1 to 100

関連する問題