From 99191b037bf2e8cb172551f5c3c29b552fce04ac Mon Sep 17 00:00:00 2001 From: Henning Hall Date: Sun, 7 Jul 2019 19:44:53 +0200 Subject: [PATCH] Change width and height (#80) --- DatePickerAndroid.js | 2 +- DatePickerIOS.js | 90 ++++--- android/build.gradle | 2 +- .../date_picker/DatePickerManager.java | 13 + .../henninghall/date_picker/PickerView.java | 4 +- .../com/henninghall/date_picker/Style.java | 21 +- .../com/henninghall/date_picker/Utils.java | 12 +- .../date_picker/wheelFunctions/Hide.java | 15 ++ .../wheelFunctions/SetShowCount.java | 19 ++ .../henninghall/date_picker/wheels/Wheel.java | 4 +- .../src/main/res/layout/datepicker_view.xml | 222 +++++++++--------- 11 files changed, 239 insertions(+), 165 deletions(-) create mode 100644 android/src/main/java/com/henninghall/date_picker/wheelFunctions/Hide.java create mode 100644 android/src/main/java/com/henninghall/date_picker/wheelFunctions/SetShowCount.java diff --git a/DatePickerAndroid.js b/DatePickerAndroid.js index e524d35..dd79365 100644 --- a/DatePickerAndroid.js +++ b/DatePickerAndroid.js @@ -4,7 +4,7 @@ import moment from 'moment' const NativeDatePicker = requireNativeComponent(`DatePickerManager`, DatePickerAndroid, { nativeOnly: { onChange: true } }); -class DatePickerAndroid extends React.Component { +class DatePickerAndroid extends React.PureComponent { static defaultProps = { mode: 'datetime', diff --git a/DatePickerIOS.js b/DatePickerIOS.js index 1774426..8e550d4 100644 --- a/DatePickerIOS.js +++ b/DatePickerIOS.js @@ -17,7 +17,7 @@ import React from 'react'; import { StyleSheet, View, requireNativeComponent } from 'react-native'; const invariant = require('fbjs/lib/invariant'); -import type {ViewProps} from 'ViewPropTypes'; +import type { ViewProps } from 'ViewPropTypes'; const RCTDatePickerIOS = requireNativeComponent('RNDatePicker'); @@ -29,7 +29,7 @@ type Props = $ReadOnly<{| /** * The currently selected date. */ - date?: ?Date, + date ?: ? Date, /** * Provides an initial value that will change when the user starts selecting @@ -39,36 +39,36 @@ type Props = $ReadOnly<{| * causes it to go out of sync with native. The initialDate prop is intended * to allow you to have native be source of truth. */ - initialDate?: ?Date, + initialDate ?: ? Date, /** * The date picker locale. */ - locale?: ?string, + locale ?: ? string, /** * Maximum date. * * Restricts the range of possible date/time values. */ - maximumDate?: ?Date, + maximumDate ?: ? Date, /** * Minimum date. * * Restricts the range of possible date/time values. */ - minimumDate?: ?Date, + minimumDate ?: ? Date, /** * The interval at which minutes can be selected. */ - minuteInterval?: ?(1 | 2 | 3 | 4 | 5 | 6 | 10 | 12 | 15 | 20 | 30), + minuteInterval ?: ? (1 | 2 | 3 | 4 | 5 | 6 | 10 | 12 | 15 | 20 | 30), /** * The date picker mode. */ - mode?: ?('date' | 'time' | 'datetime'), + mode ?: ? ('date' | 'time' | 'datetime'), /** * Date change handler. @@ -77,7 +77,7 @@ type Props = $ReadOnly<{| * The first and only argument is an Event. For getting the date the picker * was changed to, use onDateChange instead. */ - onChange?: ?(event: Event) => void, + onChange ?: ? (event: Event) => void, /** * Date change handler. @@ -88,14 +88,14 @@ type Props = $ReadOnly<{| */ onDateChange: (date: Date) => void, - /** - * Timezone offset in minutes. - * - * By default, the date picker will use the device's timezone. With this - * parameter, it is possible to force a certain timezone offset. For - * instance, to show times in Pacific Standard Time, pass -7 * 60. - */ - timeZoneOffsetInMinutes?: ?number, + /** + * Timezone offset in minutes. + * + * By default, the date picker will use the device's timezone. With this + * parameter, it is possible to force a certain timezone offset. For + * instance, to show times in Pacific Standard Time, pass -7 * 60. + */ + timeZoneOffsetInMinutes ?: ? number, |}>; /** @@ -138,35 +138,33 @@ export default class DatePickerIOS extends React.Component { 'A selected date or initial date should be specified.', ); return ( - - { - this._picker = picker; - }} - style={styles.datePickerIOS} - date={ - props.date - ? props.date.getTime() - : props.initialDate - ? props.initialDate.getTime() - : undefined - } - locale={props.locale ? props.locale : undefined} - maximumDate={ - props.maximumDate ? props.maximumDate.getTime() : undefined - } - minimumDate={ - props.minimumDate ? props.minimumDate.getTime() : undefined - } - mode={props.mode} - minuteInterval={props.minuteInterval} - timeZoneOffsetInMinutes={props.timeZoneOffsetInMinutes} - onChange={this._onChange} - onStartShouldSetResponder={() => true} - onResponderTerminationRequest={() => false} - textColor={props.textColor} - /> - + { + this._picker = picker; + }} + style={[styles.datePickerIOS, props.style]} + date={ + props.date + ? props.date.getTime() + : props.initialDate + ? props.initialDate.getTime() + : undefined + } + locale={props.locale ? props.locale : undefined} + maximumDate={ + props.maximumDate ? props.maximumDate.getTime() : undefined + } + minimumDate={ + props.minimumDate ? props.minimumDate.getTime() : undefined + } + mode={props.mode} + minuteInterval={props.minuteInterval} + timeZoneOffsetInMinutes={props.timeZoneOffsetInMinutes} + onChange={this._onChange} + onStartShouldSetResponder={() => true} + onResponderTerminationRequest={() => false} + textColor={props.textColor} + /> ); } } diff --git a/android/build.gradle b/android/build.gradle index 72a858d..79c7511 100644 --- a/android/build.gradle +++ b/android/build.gradle @@ -28,7 +28,7 @@ android { dependencies { compile fileTree(include: ['*.jar'], dir: 'libs') compile 'com.facebook.react:react-native:+' - compile 'cn.carbswang.android:NumberPickerView:1.2.0' + compile 'com.henninghall.android:NumberPickerView:1.0.1' compile 'org.apache.commons:commons-lang3:3.6' compile group: 'net.time4j', name: 'time4j-android', version: '4.2-2018i' diff --git a/android/src/main/java/com/henninghall/date_picker/DatePickerManager.java b/android/src/main/java/com/henninghall/date_picker/DatePickerManager.java index 304ec3d..28e7f68 100644 --- a/android/src/main/java/com/henninghall/date_picker/DatePickerManager.java +++ b/android/src/main/java/com/henninghall/date_picker/DatePickerManager.java @@ -1,11 +1,15 @@ package com.henninghall.date_picker; +import android.content.res.Resources; import android.support.annotation.Nullable; +import android.util.Log; +import android.util.TypedValue; import com.facebook.react.common.MapBuilder; import com.facebook.react.uimanager.SimpleViewManager; import com.facebook.react.uimanager.ThemedReactContext; import com.facebook.react.uimanager.annotations.ReactProp; +import com.facebook.react.uimanager.annotations.ReactPropGroup; import net.time4j.android.ApplicationStarter; import org.apache.commons.lang3.LocaleUtils; @@ -84,6 +88,15 @@ public class DatePickerManager extends SimpleViewManager { view.setTimeZone(timeZone); } + @ReactPropGroup(names = {"height", "width"}, customType = "Style") + public void setStyle(PickerView view, int index, Integer style) { + if(index == 0) view.style.setHeight(style); + if(index == 1) { + int width = (int) Utils.dpToPixels(style, DatePickerManager.context); + view.style.setWidth(width); + } + } + @Override protected void onAfterUpdateTransaction(PickerView view) { super.onAfterUpdateTransaction(view); diff --git a/android/src/main/java/com/henninghall/date_picker/PickerView.java b/android/src/main/java/com/henninghall/date_picker/PickerView.java index 80036e1..92ab88a 100644 --- a/android/src/main/java/com/henninghall/date_picker/PickerView.java +++ b/android/src/main/java/com/henninghall/date_picker/PickerView.java @@ -1,8 +1,10 @@ package com.henninghall.date_picker; import android.os.Build; +import android.os.Handler; import android.util.Log; import android.view.View; +import android.widget.LinearLayout; import android.widget.RelativeLayout; import com.facebook.react.bridge.Arguments; @@ -63,7 +65,7 @@ public class PickerView extends RelativeLayout { this.style = new Style(this); this.wheelOrderUpdater = new WheelOrderUpdater(this); - RelativeLayout wheelsWrapper = (RelativeLayout) rootView.findViewById(R.id.wheelsWrapper); + LinearLayout wheelsWrapper = (LinearLayout) rootView.findViewById(R.id.wheelsWrapper); wheelsWrapper.setWillNotDraw(false); locale = Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP ? Locale.forLanguageTag("en") : Locale.getDefault(); diff --git a/android/src/main/java/com/henninghall/date_picker/Style.java b/android/src/main/java/com/henninghall/date_picker/Style.java index cc6fd66..7ee060a 100644 --- a/android/src/main/java/com/henninghall/date_picker/Style.java +++ b/android/src/main/java/com/henninghall/date_picker/Style.java @@ -2,14 +2,16 @@ package com.henninghall.date_picker; import android.graphics.Color; import android.graphics.drawable.GradientDrawable; +import android.view.View; +import android.view.ViewGroup; import android.widget.ImageView; - +import com.henninghall.date_picker.wheelFunctions.SetShowCount; import com.henninghall.date_picker.wheelFunctions.TextColor; -import org.w3c.dom.Text; - class Style { + private static int DP_PER_SHOW_SHOW_COUNT = 35; + private final GradientDrawable gradientBottom; private final GradientDrawable gradientTop; private final PickerView pickerView; @@ -38,6 +40,19 @@ class Style { this.pickerView.applyOnAllWheels(new TextColor(color)); } + public void setWidth(int width) { + View view = pickerView.findViewById(R.id.container); + ViewGroup.LayoutParams layoutParams = view.getLayoutParams(); + layoutParams.width = width; + view.setLayoutParams(layoutParams); + } + + public void setHeight(int height) { + int showCount = height / DP_PER_SHOW_SHOW_COUNT; + int oddShowCount = showCount % 2 == 0 ? showCount + 1 : showCount; + pickerView.applyOnAllWheels(new SetShowCount(oddShowCount)); + } + private boolean validColor(String color){ return color != null && color.length() == 7; } diff --git a/android/src/main/java/com/henninghall/date_picker/Utils.java b/android/src/main/java/com/henninghall/date_picker/Utils.java index 57c826b..440cc7f 100644 --- a/android/src/main/java/com/henninghall/date_picker/Utils.java +++ b/android/src/main/java/com/henninghall/date_picker/Utils.java @@ -1,18 +1,18 @@ package com.henninghall.date_picker; +import android.content.Context; +import android.content.res.Resources; import android.text.format.DateUtils; import android.util.TypedValue; import android.view.View; import net.time4j.PrettyTime; -import java.sql.Time; import java.text.DateFormat; import java.text.ParseException; import java.text.SimpleDateFormat; import java.util.Calendar; -import java.util.Date; import java.util.Locale; import java.util.TimeZone; @@ -72,4 +72,12 @@ public class Utils { return format; } + public static float dpToPixels(int dp, Context context){ + return TypedValue.applyDimension( + TypedValue.COMPLEX_UNIT_DIP, + dp, + context.getResources().getDisplayMetrics() + ); + } + } diff --git a/android/src/main/java/com/henninghall/date_picker/wheelFunctions/Hide.java b/android/src/main/java/com/henninghall/date_picker/wheelFunctions/Hide.java new file mode 100644 index 0000000..35b5466 --- /dev/null +++ b/android/src/main/java/com/henninghall/date_picker/wheelFunctions/Hide.java @@ -0,0 +1,15 @@ +package com.henninghall.date_picker.wheelFunctions; + +import android.view.View; + +import com.henninghall.date_picker.wheels.Wheel; + +public class Hide implements WheelFunction { + + @Override + public void apply(Wheel wheel) { + wheel.picker.setVisibility(View.GONE); + } +} + + diff --git a/android/src/main/java/com/henninghall/date_picker/wheelFunctions/SetShowCount.java b/android/src/main/java/com/henninghall/date_picker/wheelFunctions/SetShowCount.java new file mode 100644 index 0000000..18b44a6 --- /dev/null +++ b/android/src/main/java/com/henninghall/date_picker/wheelFunctions/SetShowCount.java @@ -0,0 +1,19 @@ +package com.henninghall.date_picker.wheelFunctions; + +import com.henninghall.date_picker.wheels.Wheel; + +public class SetShowCount implements WheelFunction { + + private final int count; + + public SetShowCount(int count) { + this.count = count; + } + + @Override + public void apply(Wheel wheel) { + wheel.picker.setShownCount(this.count); + } +} + + diff --git a/android/src/main/java/com/henninghall/date_picker/wheels/Wheel.java b/android/src/main/java/com/henninghall/date_picker/wheels/Wheel.java index ec219a3..e0d6f1d 100644 --- a/android/src/main/java/com/henninghall/date_picker/wheels/Wheel.java +++ b/android/src/main/java/com/henninghall/date_picker/wheels/Wheel.java @@ -2,15 +2,13 @@ package com.henninghall.date_picker.wheels; import android.view.View; import com.henninghall.date_picker.PickerView; -import com.henninghall.date_picker.R; import org.apache.commons.lang3.LocaleUtils; import java.text.SimpleDateFormat; import java.util.ArrayList; import java.util.Calendar; -import java.util.Date; -import cn.carbswang.android.numberpickerview.library.NumberPickerView; +import cn.carbswang.android.numberpickerview.library.NumberPickerView; public abstract class Wheel { diff --git a/android/src/main/res/layout/datepicker_view.xml b/android/src/main/res/layout/datepicker_view.xml index cdf8d83..f66e360 100644 --- a/android/src/main/res/layout/datepicker_view.xml +++ b/android/src/main/res/layout/datepicker_view.xml @@ -1,149 +1,155 @@ - - + + + android:layout_width="0dp" + android:layout_weight="4" + android:layout_height="match_parent" + custom:npv_ShownCount="5" + custom:npv_RespondChangeOnDetached="false" + custom:npv_TextSizeNormal="18sp" + custom:npv_TextSizeSelected="21sp" + custom:npv_WrapSelectorWheel="false" + custom:npv_TextColorSelected="#000000" + custom:npv_TextColorNormal="#aaaaaa" + custom:npv_DividerColor="#cccccc" + custom:npv_ItemPaddingHorizontal="3dp"/> - - - + + android:layout_height="match_parent" + android:orientation="vertical" + android:layout_marginBottom="-1dp" + > + - + + +