Added textColor property (android)

android/src/main/java/com/henninghall/date_picker/DatePickerManager.java

@@ -67,6 +67,11 @@ public class DatePickerManager extends SimpleViewManager  {
     view.style.setFadeToColor(color);
   }
 
+  @ReactProp(name = "textColor")
+  public void setTextColor(PickerView view, @Nullable String color) {
+    view.style.setTextColor(color);
+  }
+
   @ReactProp(name = "minuteInterval")
   public void setMinuteInterval(PickerView view, @Nullable int interval) throws Exception {
     if (interval < 0 || interval > 59) throw new Exception("Minute interval out of bounds");

android/src/main/java/com/henninghall/date_picker/PickerView.java

@@ -1,11 +1,9 @@
 package com.henninghall.date_picker;
 
-import android.annotation.SuppressLint;
 import android.view.View;
 import android.widget.RelativeLayout;
 
 import com.facebook.react.bridge.Arguments;
-import com.facebook.react.bridge.ReadableMap;
 import com.facebook.react.bridge.WritableMap;
 import com.facebook.react.uimanager.events.RCTEventEmitter;
 import com.henninghall.date_picker.wheelFunctions.AnimateToDate;

android/src/main/java/com/henninghall/date_picker/Style.java

@@ -4,12 +4,18 @@ import android.graphics.Color;
 import android.graphics.drawable.GradientDrawable;
 import android.widget.ImageView;
 
+import com.henninghall.date_picker.wheelFunctions.TextColor;
+
+import org.w3c.dom.Text;
+
 
 class Style {
     private final GradientDrawable gradientBottom;
     private final GradientDrawable gradientTop;
+    private final PickerView pickerView;
 
     public Style(PickerView pickerView) {
+        this.pickerView = pickerView;
         ImageView overlayTop = (ImageView) pickerView.findViewById(R.id.overlay_top);
         ImageView overlayBottom = (ImageView) pickerView.findViewById(R.id.overlay_bottom);
         this.gradientTop =  (GradientDrawable) overlayTop.getDrawable();
@@ -28,6 +34,10 @@ class Style {
         }
     }
 
+    public void setTextColor(String color) {
+        this.pickerView.applyOnAllWheels(new TextColor(color));
+    }
+
     private boolean validColor(String color){
         return color != null && color.length() == 7;
     }

android/src/main/java/com/henninghall/date_picker/wheelFunctions/TextColor.java

@@ -0,0 +1,24 @@
+package com.henninghall.date_picker.wheelFunctions;
+
+import android.graphics.Color;
+
+import com.henninghall.date_picker.wheels.Wheel;
+
+public class TextColor implements WheelFunction {
+
+    private final String color;
+
+    public TextColor(String color) {
+        this.color = color;
+    }
+
+    @Override
+    public void apply(Wheel wheel) {
+        int fullColor= Color.parseColor(color);
+        int fadedColor = Color.parseColor("#70"+ color.substring(1));
+        wheel.picker.setNormalTextColor(fadedColor);
+        wheel.picker.setSelectedTextColor(fullColor);
+    }
+}
+
+

android/src/main/java/com/henninghall/date_picker/wheels/Wheel.java

@@ -19,7 +19,7 @@ public abstract class Wheel {
 
     ArrayList<String> values;
     ArrayList<String> displayValues;
-    NumberPickerView picker;
+    public NumberPickerView picker;
     public SimpleDateFormat format;
     SimpleDateFormat displayFormat;
 

example/App.js

@@ -10,7 +10,7 @@ export default class App extends Component {
 
   state = {
     picker: undefined,
-    backgroundColor: undefined,
+    backgroundColor: "#ffffff",
   }
 
   render() {
@@ -62,11 +62,11 @@ export default class App extends Component {
 const styles = StyleSheet.create({
   container: {
     flex: 1,
-    backgroundColor: '#abcdef',
-    marginTop: 15,
+    paddingTop: 15,
   },
   content: {
     alignItems: 'center',
+    flex: 1,
   },
   text: {
     color: 'dodgerblue',

example/examples/Advanced.js

@@ -16,6 +16,7 @@ export default class Advanced extends Component {
     chosenDate: new Date(),
     searchTerm: '',
     locale: DeviceInfo.getDeviceLocale(),
+    textColor: '#000000',
   }
 
   render() {
@@ -30,6 +31,7 @@ export default class Advanced extends Component {
           minimumDate={new Date()}
           maximumDate={(new Date()).addHours(24 * 5)}
           fadeToColor={this.props.backgroundColor}
+          textColor={this.state.textColor}
         />
 
         <Text>Current locale: {this.state.locale}</Text>
@@ -56,23 +58,28 @@ export default class Advanced extends Component {
         </ScrollView>
         <Text />
 
-        <Button title={'Change background color'} onPress={() => this.props.setBackground(randomColor())} />
+        <Button title={'Change background color'} onPress={this.changeColors} />
       </View>
     );
   }
+
+  changeColors = () => {
+    this.props.setBackground(randomColor());
+    this.setState({ textColor: randomColor() })
+  }
+
   setDate = (newDate) => this.setState({ chosenDate: newDate })
   searchUpdated = (term) => this.setState({ searchTerm: term })
 
 }
 
-const randomColor = () => '#' + Math.floor(Math.random() * 16777215).toString(16);
-
 const styles = StyleSheet.create({
   container: {
     flex: 1,
     alignItems: 'center',
     justifyContent: 'center',
     marginTop: 15,
+    backgroundColor: 'transparent',
   },
   item: {
     borderWidth: 1,
@@ -92,3 +99,10 @@ const styles = StyleSheet.create({
     width: 100,
   }
 })
+
+const randomColor = () => '#' + pad(Math.floor(Math.random() * 16777215).toString(16), 6);
+
+function pad(n, width) {
+  n = n + '';
+  return n.length >= width ? n : new Array(width - n.length + 1).join('0') + n;
+}