obipawan / react-native-dash Goto Github PK

A super simple <Dash /> component for react-native to draw customisable dashed lines

JavaScript 100.00%

react-native-dash's Introduction

react-native-dash

A super simple <Dash /> component for react-native to draw customisable dashed lines

Installation

npm i --save react-native-dash

Props

name	desc	type	default
`style`	Dash container style	View.PropTypes.Style	`{flexDirection = 'row'}`
`dashGap`	Gap between two dashes	number	`2`
`dashLength`	Length of each dash	number	`4`
`dashThickness`	Thickness of each dash	number	`2`
`dashColor`	Color of each dash	string	`black`
`dashStyle`	Dashes style	View.PropTypes.Style	{}

ProTip 1: Use flexDirection in style to get horizontal or vertical dashes. By default, it's row
ProTip 2: Use {borderRadius: 100, overflow: 'hidden'} in dashStyle to get rounded dotes instead of straight line dashes.

Usage

import Dash from 'react-native-dash';

//draws a horizontal dashed line with defaults. Also works with flex
render() {
    return <Dash style={{width:100, height:1}}/>
}

//draws a vertical dashed line with defaults.
render() {
    return <Dash style={{width:1, height:100, flexDirection:'column'}}/>
}

Dependenies

react-native-measureme

Development

PRs highly appreciated

License

MIT License

react-native-dash's People

Contributors

Stargazers

Watchers

react-native-dash's Issues

dashColor removed from v0.0.4

in 1b2a1c9 the dashColor property was removed from the API, the only remaining references are in the PropType declaration and in the readme.

Was this an intended step or an accident?

I would like to keep the dashColor because it feels more natural than passing a backgroundColor into the dashStyle property.

BUG - stylesStore is read-only with react-native v57+

rounded dots instead of dashes

I tried to fork your repository to add a 'rounded' property to allow the creation of rounded dots instead of the default straight lines dashes but it seems that you have restricted the forks access so here is my add-on to Dash.js

LINE 19, 20
let borderRadius = rounded ? 100 : 0;
let overflow = rounded ? 'hidden' : 'visible';

LINE 33:
<View key={i} style={{backgroundColor, width, height, marginRight, marginBottom, borderRadius, overflow}}/>

LINE 49
rounded: React.PropTypes.bool

LINE 57
rounded: false

index.d.ts should be in the release package

I'm currently using react-native-dash in a Typescript project, and it works great! However, due to index.d.ts not being included in the module, the exported component is just typed as any. I have to manually add the content of index.d.ts into my project for it to work.

This file should be included as well in the the next release, in order to have an optimal use with TS.

Build error with React Native v0.57.0

undefined is not an object (evaluating '_reactNative.View.propTypes.style')

<unknown>
    Dash.js:50:23
loadModuleImplementation
    require.js:292:12
<unknown>
    CaseTimeline.js:4
loadModuleImplementation
    require.js:292:12
<unknown>
    BankruptciesCase.js:10
loadModuleImplementation
    require.js:292:12
<unknown>
    Insolvencies.js:13
loadModuleImplementation
    require.js:292:12
<unknown>
    index.js:56
loadModuleImplementation
    require.js:292:12
<unknown>
    index.js:2
loadModuleImplementation
    require.js:292:12
guardedLoadModule
    require.js:179:45
global code
    <unknown file>:0

This is because View.propTypes.style is depreciated in React Native v0.57.0. Use ViewPropTypes.style instead see here for more info

Dash component takes some time to rendering

Hi,

I have used this library for drawing the dashed lines. It works perfectly but it takes time to rendering.

My code:

<View style={{flex:1}}>
            <Dash style={{flex:1,height:1,flexDirection:'row', marginLeft:2, marginRight:16}}  dashColor={'#868686'} dashThickness={2} dashGap={1} dashLength={2}/>
</View>

stylesStore is read-only

Looks like there is a bug with RN 0.56.0.

Could be due to the const in your code here?

const stylesStore = {}
export const getDashStyle = (props) => {
	const isRow = isStyleRow(props.style)
	const id = getDashStyleId(props, isRow)
	if (!stylesStore[ id ]) {
		stylesStore = {
			...stylesStore,
			[ id ]: createDashStyleSheet(props, isRow),
		}
	}
	return stylesStore[ id ]
}

Full border dashed view

Hi! its any way to make all borders have this custom dashed lines?
There's an example

i want to achieve that but insted with this code im only have this:

<Dash
  dashGap={10}
  dashLength={5}
  dashThickness={5}
  dashStyle={{borderRadius: 100, overflow: 'hidden'}}
  dashColor="white"
  style={{ borderRadius: 180/2, position: 'absolute', width: 180, height: 180, backgroundColor: 'cyan' }} />

I hope anyone can help me :(

Dash doesn't always re-render when props change

i have a props value for the width of the Dash, something like this:
Dash style={{width: myWidth}}...

but the component doesn't seem to always re-render when the myWidth value changes.
am I missing something here?

Next view disappear on Android

react-native-dash work perfectly on iOS.

On android it works well when I have one , but when I have multiples , the dash is render correctly but the view just after the dash disappear after few ms (Without render function called again).

Do you have any idea ?

Web support?

This component works great on iOS/Android but throws an error when used in react-native-web. Is it possible to support this?

The error is TypeError: Cannot read properties of undefined (reading 'style'):
Dash.propTypes = { style: _reactNative.ViewPropTypes.style ...}

Height of Dash not automatic scale with it's parent

Hi,

When i set flex:1 Dash height full screen, only work when i set height is constant , exp 100
how can dash auto scale by height of it's parent

ViewPropTypes error

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch [email protected] for the project I'm working on.

Here is the diff that solved my problem:

diff --git a/node_modules/react-native-dash/Dash.js b/node_modules/react-native-dash/Dash.js
index 32ff1ec..7aeae52 100644
--- a/node_modules/react-native-dash/Dash.js
+++ b/node_modules/react-native-dash/Dash.js
@@ -6,7 +6,8 @@
 
 import React from 'react'
 import PropTypes from 'prop-types'
-import { View, StyleSheet, ViewPropTypes } from 'react-native'
+import { View, StyleSheet } from 'react-native'
+import { ViewPropTypes } from 'deprecated-react-native-prop-types';
 import MeasureMeHOC from 'react-native-measureme'
 import { getDashStyle, isStyleRow } from '../util'

This issue body was partially generated by patch-package.

App crashed with react-native v0.49.3 (Android production only)

The component works as expected in development mode with the React Packager. But, if I build the app as APK-file for Android, something unexpected happens. Building and installing works fine, but if I try launch the app, it crashes. This is surely due to this package, because without it the app works like App perfectly.

Mode: Production build only
Android: 4.4 - 7.0 (or newer)
React: 16.0.0
React-native: 0.49.3

Logs via adb logcat

10-13 10:18:53.992   623   634 I ActivityManager: START u0 {act=android.intent.action.MAIN cat=[android.intent.category.LAUNCHER] flg=0x10200000 cmp=com.XXX.mobileapp/.MainActivity (has extras)} from uid 10008 on display 0
10-13 10:18:54.025   623  1848 I ActivityManager: Start proc 4594:com.XXX.mobileapp/u0a90 for activity com.XXX.mobileapp/.MainActivity
10-13 10:18:54.044  4594  4594 E libprocessgroup: failed to make and chown /acct/uid_10090: Read-only file system
10-13 10:18:54.044  4594  4594 W Zygote  : createProcessGroup failed, kernel missing CONFIG_CGROUP_CPUACCT?
10-13 10:18:54.216  4594  4594 V fb-UnpackingSoSource: locked dso store /data/user/0/com.XXX.mobileapp/lib-main
10-13 10:18:54.218  4594  4594 V fb-UnpackingSoSource: deps mismatch on deps store: regenerating
10-13 10:18:54.218  4594  4594 V fb-UnpackingSoSource: so store dirty: regenerating
10-13 10:18:54.218   623  1160 W ActivityManager: Unable to start service Intent { act=com.google.android.gms.ads.identifier.service.START pkg=com.google.android.gms } U=0: not found
10-13 10:18:54.235  4594  4594 D ApkSoSource: not allowing consideration of lib/x86/libfb.so: deferring to libdir
10-13 10:18:54.235  4594  4594 D ApkSoSource: not allowing consideration of lib/x86/libfolly_json.so: deferring to libdir
10-13 10:18:54.235  4594  4594 D ApkSoSource: not allowing consideration of lib/x86/libglog.so: deferring to libdir
10-13 10:18:54.235  4594  4594 D ApkSoSource: not allowing consideration of lib/x86/libglog_init.so: deferring to libdir
10-13 10:18:54.235  4594  4594 D ApkSoSource: not allowing consideration of lib/x86/libgnustl_shared.so: deferring to libdir
10-13 10:18:54.235  4594  4594 D ApkSoSource: not allowing consideration of lib/x86/libicu_common.so: deferring to libdir
10-13 10:18:54.237  4594  4594 D ApkSoSource: not allowing consideration of lib/x86/libimagepipeline.so: deferring to libdir
10-13 10:18:54.237  4594  4594 D ApkSoSource: not allowing consideration of lib/x86/libjsc.so: deferring to libdir
10-13 10:18:54.237  4594  4594 D ApkSoSource: not allowing consideration of lib/x86/libreactnativejni.so: deferring to libdir
10-13 10:18:54.237  4594  4594 D ApkSoSource: not allowing consideration of lib/x86/libucrop.so: deferring to libdir
10-13 10:18:54.237  4594  4594 D ApkSoSource: not allowing consideration of lib/x86/libyoga.so: deferring to libdir
10-13 10:18:54.237  4594  4594 V fb-UnpackingSoSource: regenerating DSO store com.facebook.soloader.ApkSoSource
10-13 10:18:54.239  4594  4594 V fb-UnpackingSoSource: starting syncer worker
10-13 10:18:54.270  4594  4617 D GraphRequest: Warning: Request without access token missing application ID or client token.
10-13 10:18:54.274  4594  4594 V fb-UnpackingSoSource: releasing dso store lock for /data/user/0/com.XXX.mobileapp/lib-main (from syncer thread)
10-13 10:18:54.274  4594  4594 V fb-UnpackingSoSource: not releasing dso store lock for /data/user/0/com.XXX.mobileapp/lib-main (syncer thread started)
10-13 10:18:54.279  4594  4594 D ReactNative: ReactInstanceManager.ctor()
10-13 10:18:54.280  4594  4594 D ReactNative: ReactInstanceManager.createReactContextInBackground()
10-13 10:18:54.281  4594  4594 D ReactNative: ReactInstanceManager.recreateReactContextInBackgroundInner()
10-13 10:18:54.281  4594  4594 D ReactNative: ReactInstanceManager.recreateReactContextInBackgroundFromBundleLoader()
10-13 10:18:54.281  4594  4594 D ReactNative: ReactInstanceManager.recreateReactContextInBackground()
10-13 10:18:54.281  4594  4594 D ReactNative: ReactInstanceManager.runCreateReactContextOnNewThread()
10-13 10:18:54.281   917  1092 E Surface : getSlotFromBufferLocked: unknown buffer: 0xeb0ef1c0
10-13 10:18:54.288  4594  4624 D OpenGLRenderer: Use EGL_SWAP_BEHAVIOR_PRESERVED: true
10-13 10:18:54.299  4594  4594 D         : HostConnection::get() New Host Connection established 0xe9b52f60, tid 4594
10-13 10:18:54.299  4594  4623 I art     : Thread[19,tid=4623,Native,Thread*=0xe061f500,peer=0x12c26d00,"Thread-301"] recursive attempt to load library "/data/app/com.XXX.mobileapp-1/lib/x86/libfb.so"
10-13 10:18:54.300  4594  4623 D ReactNative: ReactInstanceManager.createReactContext()
10-13 10:18:54.306  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.ARTGroupViewManager
10-13 10:18:54.306  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.ARTGroupShadowNode
10-13 10:18:54.307  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.ARTShapeViewManager
10-13 10:18:54.307  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.ARTShapeShadowNode
10-13 10:18:54.327  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.ARTTextViewManager
10-13 10:18:54.328  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.ARTTextShadowNode
10-13 10:18:54.328  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.checkbox.ReactCheckBoxManager
10-13 10:18:54.331  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.uimanager.LayoutShadowNode
10-13 10:18:54.334  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.picker.ReactDialogPickerManager
10-13 10:18:54.334  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.drawer.ReactDrawerLayoutManager
10-13 10:18:54.335  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.picker.ReactDropdownPickerManager
10-13 10:18:54.336  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.scroll.ReactHorizontalScrollViewManager
10-13 10:18:54.337  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.progressbar.ReactProgressBarViewManager
10-13 10:18:54.337  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.progressbar.ProgressBarShadowNode
10-13 10:18:54.338  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.scroll.ReactScrollViewManager
10-13 10:18:54.338  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.slider.ReactSliderManager
10-13 10:18:54.339  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.slider.ReactSliderManager$ReactSliderShadowNode
10-13 10:18:54.339  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.switchview.ReactSwitchManager
10-13 10:18:54.342  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.switchview.ReactSwitchManager$ReactSwitchShadowNode
10-13 10:18:54.342  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.toolbar.ReactToolbarManager
10-13 10:18:54.343  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.webview.ReactWebViewManager
10-13 10:18:54.344  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.swiperefresh.SwipeRefreshLayoutManager
10-13 10:18:54.344  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.ARTSurfaceViewManager
10-13 10:18:54.344  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.art.ARTSurfaceViewShadowNode
10-13 10:18:54.345  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.text.frescosupport.FrescoBasedReactTextInlineImageViewManager
10-13 10:18:54.345  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.text.frescosupport.FrescoBasedReactTextInlineImageShadowNode
10-13 10:18:54.346  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.image.ReactImageManager
10-13 10:18:54.348  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.modal.ReactModalHostManager
10-13 10:18:54.348  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.modal.ModalHostShadowNode
10-13 10:18:54.349  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.text.ReactRawTextManager
10-13 10:18:54.351  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.text.ReactTextShadowNode
10-13 10:18:54.354  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.textinput.ReactTextInputManager
10-13 10:18:54.356  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.textinput.ReactTextInputShadowNode
10-13 10:18:54.356  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.text.ReactTextViewManager
10-13 10:18:54.356  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.view.ReactViewManager
10-13 10:18:54.359  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.viewpager.ReactViewPagerManager
10-13 10:18:54.363  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.react.views.text.ReactVirtualTextViewManager
10-13 10:18:54.369  4594  4624 D libEGL  : loaded /system/lib/egl/libEGL_emulation.so
10-13 10:18:54.369  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.reactnative.androidsdk.FBLikeViewManager
10-13 10:18:54.373  4594  4624 D libEGL  : loaded /system/lib/egl/libGLESv1_CM_emulation.so
10-13 10:18:54.374  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.reactnative.androidsdk.FBLoginButtonManager
10-13 10:18:54.375  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.reactnative.androidsdk.FBSendButtonManager
10-13 10:18:54.375  4594  4623 W art     : Before Android 4.1, method boolean com.facebook.share.widget.ShareButtonBase.canShare() would have incorrectly overridden the package-private method in android.widget.TextView
10-13 10:18:54.375  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.facebook.reactnative.androidsdk.FBShareButtonManager
10-13 10:18:54.376  4594  4623 W unknown:ViewManagerPropertyUpdater: Could not find generated setter for class com.BV.LinearGradient.LinearGradientManager
10-13 10:18:54.384  4594  4624 D libEGL  : loaded /system/lib/egl/libGLESv2_emulation.so
10-13 10:18:54.389  4594  4623 D ReactNative: Initializing React Xplat Bridge.
10-13 10:18:54.395  4594  4624 D         : HostConnection::get() New Host Connection established 0xdecf64a0, tid 4624
10-13 10:18:54.398  4594  4623 D ReactNative: Initializing React Xplat Bridge before initializeBridge
10-13 10:18:54.402  4594  4623 D ReactNative: Initializing React Xplat Bridge after initializeBridge
10-13 10:18:54.402  4594  4623 D ReactNative: CatalystInstanceImpl.runJSBundle()
10-13 10:18:54.416  4594  4629 D ReactNative: ReactInstanceManager.setupReactContext()
10-13 10:18:54.416  4594  4629 D ReactNative: CatalystInstanceImpl.initialize()
10-13 10:18:54.416  4594  4629 D ReactNative: ReactInstanceManager.attachRootViewToInstance()
10-13 10:18:54.430  4594  4624 I OpenGLRenderer: Initialized EGL, version 1.4
10-13 10:18:54.446  4594  4624 W EGL_emulation: eglSurfaceAttrib not implemented
10-13 10:18:54.446  4594  4624 W OpenGLRenderer: Failed to set EGL_SWAP_BEHAVIOR on surface 0xdecf7540, error=EGL_SUCCESS
10-13 10:18:54.496   623   642 I ActivityManager: Displayed com.XXX.mobileapp/.MainActivity: +497ms
10-13 10:18:54.548  4594  4608 D GraphRequest: Warning: Request without access token missing application ID or client token.
10-13 10:18:54.717  4594  4627 E ReactNativeJS: undefined is not an object (evaluating 'u.View.propTypes.style')
10-13 10:18:54.719  4594  4627 E ReactNativeJS: Module AppRegistry is not a registered callable module (calling runApplication)
10-13 10:18:54.720  4594  4629 E AndroidRuntime: FATAL EXCEPTION: mqt_native_modules
10-13 10:18:54.720  4594  4629 E AndroidRuntime: Process: com.XXX.mobileapp, PID: 4594
10-13 10:18:54.720  4594  4629 E AndroidRuntime: com.facebook.react.common.JavascriptException: undefined is not an object (evaluating 'u.View.propTypes.style'), stack:
10-13 10:18:54.720  4594  4629 E AndroidRuntime: <unknown>@890:643
10-13 10:18:54.720  4594  4629 E AndroidRuntime: i@2:565
10-13 10:18:54.720  4594  4629 E AndroidRuntime: n@2:348
10-13 10:18:54.720  4594  4629 E AndroidRuntime: t@2:210
10-13 10:18:54.720  4594  4629 E AndroidRuntime: <unknown>@889:453
10-13 10:18:54.720  4594  4629 E AndroidRuntime: i@2:565
10-13 10:18:54.720  4594  4629 E AndroidRuntime: n@2:348
10-13 10:18:54.720  4594  4629 E AndroidRuntime: t@2:210
10-13 10:18:54.720  4594  4629 E AndroidRuntime: <unknown>@885:2056
10-13 10:18:54.720  4594  4629 E AndroidRuntime: i@2:565
10-13 10:18:54.720  4594  4629 E AndroidRuntime: n@2:348
10-13 10:18:54.720  4594  4629 E AndroidRuntime: t@2:210
10-13 10:18:54.720  4594  4629 E AndroidRuntime: <unknown>@304:1924
10-13 10:18:54.720  4594  4629 E AndroidRuntime: i@2:565
10-13 10:18:54.720  4594  4629 E AndroidRuntime: n@2:348
10-13 10:18:54.720  4594  4629 E AndroidRuntime: t@2:210
10-13 10:18:54.720  4594  4629 E AndroidRuntime: <unknown>@12:38
10-13 10:18:54.720  4594  4629 E AndroidRuntime: i@2:565
10-13 10:18:54.720  4594  4629 E AndroidRuntime: n@2:278
10-13 10:18:54.720  4594  4629 E AndroidRuntime: t@2:210
10-13 10:18:54.720  4594  4629 E AndroidRuntime: global code@1049:9
10-13 10:18:54.720  4594  4629 E AndroidRuntime:
10-13 10:18:54.720  4594  4629 E AndroidRuntime: 	at com.facebook.react.modules.core.ExceptionsManagerModule.showOrThrowError(ExceptionsManagerModule.java:56)
10-13 10:18:54.720  4594  4629 E AndroidRuntime: 	at com.facebook.react.modules.core.ExceptionsManagerModule.reportFatalException(ExceptionsManagerModule.java:40)
10-13 10:18:54.720  4594  4629 E AndroidRuntime: 	at java.lang.reflect.Method.invoke(Native Method)
10-13 10:18:54.720  4594  4629 E AndroidRuntime: 	at com.facebook.react.bridge.JavaMethodWrapper.invoke(JavaMethodWrapper.java:363)
10-13 10:18:54.720  4594  4629 E AndroidRuntime: 	at com.facebook.react.bridge.JavaModuleWrapper.invoke(JavaModuleWrapper.java:162)
10-13 10:18:54.720  4594  4629 E AndroidRuntime: 	at com.facebook.react.bridge.queue.NativeRunnable.run(Native Method)
10-13 10:18:54.720  4594  4629 E AndroidRuntime: 	at android.os.Handler.handleCallback(Handler.java:739)
10-13 10:18:54.720  4594  4629 E AndroidRuntime: 	at android.os.Handler.dispatchMessage(Handler.java:95)
10-13 10:18:54.720  4594  4629 E AndroidRuntime: 	at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(MessageQueueThreadHandler.java:31)
10-13 10:18:54.720  4594  4629 E AndroidRuntime: 	at android.os.Looper.loop(Looper.java:148)
10-13 10:18:54.720  4594  4629 E AndroidRuntime: 	at com.facebook.react.bridge.queue.MessageQueueThreadImpl$3.run(MessageQueueThreadImpl.java:194)
10-13 10:18:54.720  4594  4629 E AndroidRuntime: 	at java.lang.Thread.run(Thread.java:818)
10-13 10:18:54.721   623  1159 W ActivityManager:   Force finishing activity com.XXX.mobileapp/.MainActivity
10-13 10:18:54.735   315   315 E EGL_emulation: tid 315: eglCreateSyncKHR(1215): error 0x3004 (EGL_BAD_ATTRIBUTE)
10-13 10:18:54.801   917  1092 W EGL_emulation: eglSurfaceAttrib not implemented
10-13 10:18:54.801   917  1092 W OpenGLRenderer: Failed to set EGL_SWAP_BEHAVIOR on surface 0xde81f8e0, error=EGL_SUCCESS
10-13 10:18:54.810   623  1765 I OpenGLRenderer: Initialized EGL, version 1.4
10-13 10:18:54.826   623  1765 W EGL_emulation: eglSurfaceAttrib not implemented
10-13 10:18:54.826   623  1765 W OpenGLRenderer: Failed to set EGL_SWAP_BEHAVIOR on surface 0xd8d3d2a0, error=EGL_SUCCESS
10-13 10:18:54.859  4594  4624 E Surface : getSlotFromBufferLocked: unknown buffer: 0xf2c3a500
10-13 10:18:55.109  4594  4594 D ReactNative: ReactInstanceManager.detachViewFromInstance()
10-13 10:18:55.109  4594  4627 E ReactNativeJS: Module AppRegistry is not a registered callable module (calling unmountApplicationComponentAtRootTag)
10-13 10:18:56.545  4594  4629 I Process : Sending signal. PID: 4594 SIG: 9
10-13 10:18:56.567   623   768 W libprocessgroup: failed to open /acct/uid_10090/pid_4594/cgroup.procs: No such file or directory
10-13 10:18:56.567   623  1848 D GraphicsStats: Buffer count: 7
10-13 10:18:56.567   623   768 I ActivityManager: Process com.XXX.mobileapp (pid 4594) has died
10-13 10:18:56.569   623  1765 E Surface : getSlotFromBufferLocked: unknown buffer: 0xde8673a0
10-13 10:18:56.571   623  1765 D OpenGLRenderer: endAllStagingAnimators on 0xdf0c2700 (RippleDrawable) with handle 0xd8f3e550
10-13 10:18:56.572   623  1160 W InputMethodManagerService: Got RemoteException sending setActive(false) notification to pid 4594 uid 10090
10-13 10:18:56.602   316   680 D AudioFlinger: mixer(0xf1dc0000) throttle end: throttle time(21)
10-13 10:18:56.785   623   642 W AppOps  : Finishing op nesting under-run: uid 1000 pkg android code 24 time=0 duration=0 nesting=0
10-13 10:18:59.216   623  1492 D NetlinkSocketObserver: NeighborEvent{elapsedMs=5671292, 10.0.3.2, [525400123502], RTM_NEWNEIGH, NUD_REACHABLE}

This issue seems to be related to the unresolved facebook/react-native#6692. I tried to figure out a solution for a PR, but I think the issue is related to de dependency react-native-measureme, so I moved to an alternative package. But actually this helps to figure out a solution.

How to draw dynamic content wise vertical line

How to make a Dashed View Box ?

Hi,

I have used this library to make a dashed line and it works really well. However, I want to make a dashed view box using the same library? Is it possible to achieve it?

I have tried to make a dashed view box using below code:

<View style={{
      borderStyle: "dashed",
      borderWidth: 1,
      borderRadius: 1,
    }}>
    </View>

It works fine, well I am not able to give dashThickness and dashLength like in this library.

Can some one help?

Thanks in advance

failed to compile

I have the following error when importing the module:

./node_modules/react-native-dash/Dash.js 21:3
Module parse failed: Unexpected token (21:3)
You may need an appropriate loader to handle this file type.
| 	for (let i = 0; i < n; i++) {
| 		dash.push(
> 			<View
| 				key={ i }
| 				style={ [

What could be the problem?

Dash makes parent's onLayout unreliable

Hey there,

First of all, thanks for the lib!

I encountered an issue while using this lib:

Using onLayout on a component containing react-native-dash gives inconsitent result: onLayout is called twice with different values

This seems to be linked to our usage of react-native-measureme,

Even if we don't find a fix, at least future users will be warned ;)

Dash line looks like 2 px width in iOS

I am using this package in my project and tested with both iPhone and Android.
I set width as 1px, and in Android it works fine, but in iOS it looks like 2px even though I set as 1 px.

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web

Some thing interesting about web. New door for the world.
server

A server is a program made to process requests and deliver data to clients.
Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.