react-native-radial-menu's People
Forkers
bouchertommy leefurong mirosmania dcworldwide dodo0822 petebalsavias janzal uhcodered mike623 michaelbdai skylinezum roselind phpsmarter cqululei yian danielsuo enisinanaj haoflynet jevense antoinefotso petrovick sharkdeng nareshpalle9 kanishka-chandrareact-native-radial-menu's Issues
React-native-radial-menu fails in production
hi guys i am about to launch an application in react-native and i am using this component, but when i navigate to a view that contains react-native-radial-menu it fails, basically the phone turns off like 10 secs, and then gets me out from the app, everything else in the app is working just fine. the strange thing here, is that it was working well for testing no issues there, not warnings in the console, but when i attached the BUNDLE (command react-native bundle) to the device itself. the component's behavior changed, in simulator it was very very slow, in the real device just fails. my device for testing is an iphone 5s.
Note: when i replace the component for a simple to test if there is something wrong in my code, everything run good
Making it impossible to swipe completely through items?
Is there a way to make the items connect to the root from a further ditance and faster? and prohibit the root to surpass the items? Or make the root snap back if it surpasses them?
I want to prevent this from happening. And maybe tweak things a bit so that items connect and attach faster and therefor trigger onSelect() faster. Is there a way to do this?
Images do not work in radial menu
error running radialmenu
here is the code
/**
- Sample React Native App
- https://github.com/facebook/react-native
- @flow
*/
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View
} from 'react-native';
var RadialMenu = require('react-native-radial-menu');
export default class rmnu extends Component {
componentWillMount() {
this.setState({output: ""});
}
_onOpen() {
this.setState({
output: 'on menu open'
})
}
_onClose() {
this.setState({
output: 'on menu close'
})
}
renderItems(count) {
return [...Array(count)].map((_, i) => {
return (
<View style={styles.item} key={i}
onSelect={ () => {
this.setState({output: onSelect ${i}
})
} }>
{i}
);
})
}
renderRoot() {
return (
<View style={[styles.item, styles.root]}>
MENU
)
}
render() {
return (
{this.state.output}
<RadialMenu onOpen={() => {}} onClose={() => {}}>
ROOT
<Text onSelect={() => {}}>A
<Text onSelect={() => {}}>B
<Text onSelect={() => {}}>C
<Text onSelect={() => {}}>D
)
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'space-around',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
item: {
height: 60,
width: 60,
borderRadius: 30,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#DDD'
},
root: {
backgroundColor: '#FFCC00'
}
});
AppRegistry.registerComponent('rmnu', () => rmnu);
Question: Why do you copy children from props to state?
Hi, great lib. Just wondering why you need to copy children from props to state? With this design, it creates an issue as the children will no longer re-render when their props change.
Android Example
the example code do not work properly on android , the button doesn't appear when i tap on the main button
Alignment does not work on Android
The radial menu's functionality works great and is exactly what I have searched for,
However there is one problem with the alignment of the menu on Android. No matter the props or style settings.
While I think the center alignment works in theory due to the fact that there is space reserved, The root and children nodes are not being centered with the radial menu's outer layout, but instead always at the top left corner, even while other items added to the main View are centered correctly.
react-native: 0.49.3
Edit: The problem was related to another special component in the same view. It somehow caused layout problems.
Error during start up
Items can't be Touchables on Android
works well on iOS, but onPress doesn't get triggered on Android. Any workaround?
<RadialMenu onOpen={() => {}} onClose={() => {}}>
<Text>ROOT</Text>
<TouchableOpacity onSelect={() => {}} onPress={() => Alert.alert("test","test")}>A</TouchableOpacity>
<TouchableOpacity onSelect={() => {}} onPress={() => Alert.alert("test","test")}>B</TouchableOpacity>
<TouchableOpacity onSelect={() => {}} onPress={() => Alert.alert("test","test")}>C</TouchableOpacity>
<TouchableOpacity onSelect={() => {}} onPress={() => Alert.alert("test","test")}>D</TouchableOpacity>
</RadialMenu>
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.