Browse Source

Improve intro slides style

Arnaud Vergnet 3 years ago
parent
commit
fd44a32b05
1 changed files with 10 additions and 2 deletions
  1. 10
    2
      src/components/Overrides/CustomIntroSlider.js

+ 10
- 2
src/components/Overrides/CustomIntroSlider.js View File

@@ -174,7 +174,7 @@ export default class CustomIntroSlider extends React.Component<
174 174
         {state.currentSlide === index ? (
175 175
           <View style={{height: '100%', flex: 1}}>
176 176
             <View style={{flex: 1}}>{item.view()}</View>
177
-            <Animatable.View animation="fadeIn">
177
+            <Animatable.View useNativeDriver animation="fadeIn">
178 178
               {index !== 0 && index !== this.introSlides.length - 1 ? (
179 179
                 <Mascot
180 180
                   style={{
@@ -218,15 +218,18 @@ export default class CustomIntroSlider extends React.Component<
218 218
                   borderColor: 'rgba(0,0,0,0.60)',
219 219
                   borderWidth: 4,
220 220
                   borderRadius: 10,
221
+                  elevation: 0,
221 222
                 }}>
222 223
                 <Card.Content>
223 224
                   <Animatable.Text
225
+                    useNativeDriver
224 226
                     animation="fadeIn"
225 227
                     delay={100}
226 228
                     style={styles.title}>
227 229
                     {item.title}
228 230
                   </Animatable.Text>
229 231
                   <Animatable.Text
232
+                    useNativeDriver
230 233
                     animation="fadeIn"
231 234
                     delay={200}
232 235
                     style={styles.text}>
@@ -320,7 +323,10 @@ export default class CustomIntroSlider extends React.Component<
320 323
   static getIconView(icon: MaterialCommunityIconsGlyphs): React.Node {
321 324
     return (
322 325
       <View style={{flex: 1}}>
323
-        <Animatable.View style={styles.center} animation="fadeIn">
326
+        <Animatable.View
327
+          useNativeDriver
328
+          style={styles.center}
329
+          animation="fadeIn">
324 330
           <MaterialCommunityIcons name={icon} color="#fff" size={200} />
325 331
         </Animatable.View>
326 332
       </View>
@@ -355,6 +361,7 @@ export default class CustomIntroSlider extends React.Component<
355 361
   getRenderNextButton = (): React.Node => {
356 362
     return (
357 363
       <Animatable.View
364
+        useNativeDriver
358 365
         animation="fadeIn"
359 366
         style={{
360 367
           borderRadius: 25,
@@ -369,6 +376,7 @@ export default class CustomIntroSlider extends React.Component<
369 376
   getRenderDoneButton = (): React.Node => {
370 377
     return (
371 378
       <Animatable.View
379
+        useNativeDriver
372 380
         animation="bounceIn"
373 381
         style={{
374 382
           borderRadius: 25,

Loading…
Cancel
Save