ソースを参照

Add BottomTabs elevation configuration (#3980)

Raul Migdonio Rodriguez Te 6 年 前
コミット
f684c1ddd2

+ 1
- 0
docs/docs/styling.md ファイルの表示

@@ -237,6 +237,7 @@ Navigation.mergeOptions(this.props.componentId, {
237 237
     }
238 238
   },
239 239
   bottomTabs: {
240
+    elevation: 8, // BottomTabs elevation in dp
240 241
     titleDisplayMode: 'alwaysShow' | 'showWhenActive' | 'alwaysHide' // Sets the title state for each tab.
241 242
   },
242 243
   bottomTab: {

+ 7
- 0
lib/android/app/src/main/java/com/reactnativenavigation/parse/BottomTabsOptions.java ファイルの表示

@@ -2,8 +2,10 @@ package com.reactnativenavigation.parse;
2 2
 
3 3
 import com.reactnativenavigation.parse.params.Bool;
4 4
 import com.reactnativenavigation.parse.params.Colour;
5
+import com.reactnativenavigation.parse.params.Fraction;
5 6
 import com.reactnativenavigation.parse.params.NullBool;
6 7
 import com.reactnativenavigation.parse.params.NullColor;
8
+import com.reactnativenavigation.parse.params.NullFraction;
7 9
 import com.reactnativenavigation.parse.params.NullNumber;
8 10
 import com.reactnativenavigation.parse.params.NullText;
9 11
 import com.reactnativenavigation.parse.params.Number;
@@ -11,6 +13,7 @@ import com.reactnativenavigation.parse.params.Text;
11 13
 import com.reactnativenavigation.parse.params.TitleDisplayMode;
12 14
 import com.reactnativenavigation.parse.parsers.BoolParser;
13 15
 import com.reactnativenavigation.parse.parsers.ColorParser;
16
+import com.reactnativenavigation.parse.parsers.FractionParser;
14 17
 import com.reactnativenavigation.parse.parsers.NumberParser;
15 18
 import com.reactnativenavigation.parse.parsers.TextParser;
16 19
 
@@ -28,6 +31,7 @@ public class BottomTabsOptions {
28 31
 		options.visible = BoolParser.parse(json,"visible");
29 32
         options.drawBehind = BoolParser.parse(json, "drawBehind");
30 33
 		options.animate = BoolParser.parse(json,"animate");
34
+        options.elevation = FractionParser.parse(json, "elevation");
31 35
         options.testId = TextParser.parse(json, "testID");
32 36
         options.titleDisplayMode = TitleDisplayMode.fromString(json.optString("titleDisplayMode"));
33 37
 
@@ -39,6 +43,7 @@ public class BottomTabsOptions {
39 43
     public Bool drawBehind = new NullBool();
40 44
 	public Bool animate = new NullBool();
41 45
 	public Number currentTabIndex = new NullNumber();
46
+	public Fraction elevation = new NullFraction();
42 47
 	public Text currentTabId = new NullText();
43 48
     public Text testId = new NullText();
44 49
     public TitleDisplayMode titleDisplayMode = TitleDisplayMode.UNDEFINED;
@@ -49,6 +54,7 @@ public class BottomTabsOptions {
49 54
 		if (other.visible.hasValue()) visible = other.visible;
50 55
         if (other.drawBehind.hasValue()) drawBehind = other.drawBehind;
51 56
 		if (other.animate.hasValue()) animate = other.animate;
57
+        if (other.elevation.hasValue()) elevation = other.elevation;
52 58
         if (other.backgroundColor.hasValue()) backgroundColor = other.backgroundColor;
53 59
         if (other.testId.hasValue()) testId = other.testId;
54 60
         if (other.titleDisplayMode.hasValue()) titleDisplayMode = other.titleDisplayMode;
@@ -60,6 +66,7 @@ public class BottomTabsOptions {
60 66
         if (!visible.hasValue()) visible = defaultOptions.visible;
61 67
         if (!drawBehind.hasValue()) drawBehind = defaultOptions.drawBehind;
62 68
         if (!animate.hasValue()) animate = defaultOptions.animate;
69
+        if (!elevation.hasValue()) elevation = defaultOptions.elevation;
63 70
         if (!backgroundColor.hasValue()) backgroundColor = defaultOptions.backgroundColor;
64 71
         if (!titleDisplayMode.hasValue()) titleDisplayMode = defaultOptions.titleDisplayMode;
65 72
     }

+ 3
- 0
lib/android/app/src/main/java/com/reactnativenavigation/presentation/BottomTabsOptionsPresenter.java ファイルの表示

@@ -158,5 +158,8 @@ public class BottomTabsOptionsPresenter {
158 158
                 bottomTabs.hideBottomNavigation(false);
159 159
             }
160 160
         }
161
+        if (options.elevation.hasValue()) {
162
+            bottomTabs.setUseElevation(true, options.elevation.get().floatValue());
163
+        }
161 164
     }
162 165
 }

+ 5
- 0
lib/src/interfaces/Options.ts ファイルの表示

@@ -411,6 +411,11 @@ export interface OptionsBottomTabs {
411 411
    * #### (Android specific)
412 412
    */
413 413
   titleDisplayMode?: 'alwaysShow' | 'showWhenActive' | 'alwaysHide';
414
+  /**
415
+   * Set the elevation of the Bottom Tabs in dp
416
+   * #### (Android specific)
417
+   */
418
+  elevation?: AndroidDensityNumber;
414 419
 }
415 420
 
416 421
 export interface OptionsBottomTab {