dash-draggable icon indicating copy to clipboard operation
dash-draggable copied to clipboard

deltaX/deltaY properties not set when using handler

Open SterlingButters opened this issue 6 years ago • 3 comments

This appears to be the case in the following example where deltaX/deltaY properties always take on value of 0:

import dash
import dash_html_components as html
from dash.dependencies import Output, Input, State
import dash_core_components as dcc
import dash_daq as daq
import dash_draggable as drag

import sd_material_ui

external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']

app = dash.Dash(external_stylesheets=external_stylesheets)
app.config['suppress_callback_exceptions']=True
# A FlatButton on Paper
app.layout = html.Div([

    drag.dash_draggable(id='dragger',
                        handle='.handle',
                        defaultPosition={'x': 200, 'y': 0},
                        children=[
                            html.Div([
                            sd_material_ui.Paper(children=[
                                sd_material_ui.IconButton(
                                    id='button',
                                    iconClassName='glyphicon glyphicon-menu-hamburger',
                                    iconStyle={'color': 'grey',
                                               'width': 50,
                                               'height': 50,
                                               'position': 'relative',
                                               'top': '2px',
                                               'left': '-12px'},
                                    tooltip='Drag Me', touch=True,
                                    tooltipPosition='bottom-right')],
                                zDepth=3,
                                circle=True,
                                style=dict(height=50,
                                           width=50,
                                           textAlign='center',
                                           position='relative',
                                           display='inline-block',
                                           top='25px',
                                           left='-25px')
                            )], className='handle'),

                            html.Div(id='graph-container')
                        ]),
])


@app.callback(
     Output('graph-container', 'children'),
    [Input('button', 'n_clicks')],
    [State('dragger', 'deltaX'),
     State('dragger', 'deltaY')]
)
def hide_graph(clicks: int, deltaX: int, deltaY: int):
    KNOB = sd_material_ui.Paper(zDepth=1,
                                style=dict(height=625,
                                           width=750),
                                children=[
                                    html.Div([
                                        daq.Knob(
                                            label="Gradient Ranges",
                                            value=7,
                                            size=500,
                                            color={"gradient": True,
                                                   "ranges": {"red": [0, 5], "yellow": [5, 9],
                                                              "green": [9, 10]}},
                                            style=dict(position='relative',
                                                       top='25px',
                                                       left='0px'))
                                    ])
                                ]),

    print(deltaX, deltaY)

    # <Graph Render Logic dependent on deltaX, deltaY>


if __name__ == '__main__':
    app.css.append_css({'external_url': 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css'})
    app.run_server(debug=True)

Perhaps there are conflicts from coexisting/nested components? Needs evaluation

SterlingButters avatar Feb 16 '19 04:02 SterlingButters

Hmm could you try rewriting the app with all components in the layout?

xhluca avatar Feb 17 '19 01:02 xhluca

Ill try that out and post back

SterlingButters avatar Feb 17 '19 04:02 SterlingButters

Issue not resolved but found a workaround for goal - will post PR here soon

SterlingButters avatar Feb 27 '19 14:02 SterlingButters