octopitus / rn-sliding-up-panel

Draggable sliding up panel implemented in React Native https://octopitus.github.io/rn-sliding-up-panel/
MIT License
930 stars 157 forks source link

How can implement show(Top) on double click? #200

Open areksiekiera opened 3 years ago

areksiekiera commented 3 years ago

Issue Description

I would like the panel to open/close on double click on handler.

Steps to Reproduce / Code Snippets / Screenshots

I've tried adding TouchableWithoutFeedback around handler which works, but now I can't drag it normally.

let backCount = 0
let backTimer = false
return (
      <SlidingUpPanel
          allowDragging={allowDragging}
          friction={0.4}
          containerStyle={styles.panel}
          ref={refSlider}
          draggableRange={draggableRange}
          onDragEnd={(value, gestureState) => {setPanelLocation(value)}}
      >
        {dragHandler => (

            <Layout style={styles.handler}>

              <TouchableWithoutFeedback
                onPress={() => {
                  backCount++
                  if (backCount == 2) {
                      clearTimeout(backTimer)
                      toggle()
                  } else {
                      backTimer = setTimeout(() => {
                        backCount = 0
                      }, 3000) 
                  }
                }}
              >
                <Layout style={dragHandlerStyle} {...dragHandler}>
                  { dragHandlerTitle }
                </Layout>
              </TouchableWithoutFeedback>

              <ScrollView
                onTouchStart={() => setAllowDragging(false)}
                onTouchEnd={() => setAllowDragging(true)}
                onTouchCancel={() => setAllowDragging(true)}
                style={styles.container}
              >

                { panelView }
              </ScrollView>

            </Layout>
        )}
      </SlidingUpPanel>
)

Environment