Skip to content

Commit

Permalink
readme.v1
Browse files Browse the repository at this point in the history
  • Loading branch information
enes/macOS authored and enes/macOS committed Sep 18, 2020
1 parent f69f2d5 commit 5dc22ac
Show file tree
Hide file tree
Showing 3 changed files with 44 additions and 70 deletions.
8 changes: 4 additions & 4 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -51,8 +51,8 @@ export default class App extends Component {
render() {
return (
<DragTextEditor
minW={100}
minH={100}
minWidth={100}
minHeight={100}
w={200}
h={200}
x={WINDOW.width/4}
Expand Down Expand Up @@ -108,8 +108,8 @@ export default class App extends Component {
|y | `150` | String| Y location of Components|
|w | `200` | Number| First Width |
|h | `200` | Number| First Height |
|minW | `200` | Number| Minimum Width |
|minH | `200` | Number| Minimum Height |
|minWidth | `200` | Number| Minimum Width |
|minHeight | `200` | Number| Minimum Height |
## Features
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "react-native-drag-text-editor",
"version": "0.0.3",
"version": "0.0.4",
"description": "React Native Text Prototype for photo editing / manipulation cases.",
"main": "index.js",
"scripts": {
Expand Down
104 changes: 39 additions & 65 deletions src/DragTextEditor.js
Original file line number Diff line number Diff line change
Expand Up @@ -35,8 +35,8 @@ export default class DragTextEditor extends Component {
y,
w,
h,
minW,
minH,
minWidth,
minHeight,
} = props;

this.state = {
Expand All @@ -47,11 +47,10 @@ export default class DragTextEditor extends Component {
LEFT_EDGE,
CENTER,
],
isSelected: false,
x:x,
y:y,
w: w < minW ? minW : w,
h: h < minH ? minH :h,
w: w < minWidth ? minWidth : w,
h: h < minHeight ? minHeight :h,
ended:true,
giveInput:false,
text: this.props.PlaceHolder==null?TEXT:this.props.PlaceHolder,
Expand Down Expand Up @@ -216,17 +215,11 @@ childMR=()=>{
}


onResizeStart = (coord) => {
onResizeStart = (location) => {
const {
onResizeStart,
} = this.props;

this.setState(() => {
return {
isSelected: true,
};
});

if (onResizeStart !== null) {
onResizeStart([
this.state.x,
Expand All @@ -235,11 +228,10 @@ childMR=()=>{
}
}

onResizeMR = (coord) => {
onResizeMR = (location) => {
const {
minW,
isResizable,
limitation,
windowBorder,
onResize,
} = this.props;

Expand All @@ -248,14 +240,14 @@ childMR=()=>{
}

this.setState(() => {
const newW = this.state.w + coord[0];
const calcWidth = this.state.w + location[0];

if (newW >= this.props.minW) {
if (limitation.w >= this.state.x + newW) {
this.state.w = newW;
if (calcWidth >= this.props.minWidth) {
if (windowBorder.w >= this.state.x + calcWidth) {
this.state.w = calcWidth;
}
}
if(newW<=150){
if(calcWidth<=150){
this.state.w = 150;
}
if (onResize !== null) {
Expand All @@ -269,11 +261,11 @@ childMR=()=>{
});
}

onResizeML = (coord) => {
onResizeML = (location) => {
const {
minW,
minWidth,
isResizable,
limitation,
windowBorder,
onResize,
} = this.props;

Expand All @@ -282,12 +274,12 @@ childMR=()=>{
}

this.setState(() => {
const newX = this.state.x + coord[0];
const newW = this.state.x + this.state.w - newX;
const newX = this.state.x + location[0];
const calcWidth = this.state.x + this.state.w - newX;

if (newW >= minW) {
if (limitation.x <= newX) {
this.state.w = newW;
if (calcWidth >= minWidth) {
if (windowBorder.x <= newX) {
this.state.w = calcWidth;
this.state.x = newX;
}
}
Expand All @@ -303,17 +295,12 @@ childMR=()=>{
});
}

onResizeEnd = (coord) => {
onResizeEnd = (location) => {
const {
onResizeEnd,
} = this.props;

this.setState(() => {
return {
isSelected: false,
};
});


if (onResizeEnd !== null) {
onResizeEnd([
this.state.x,
Expand All @@ -322,18 +309,11 @@ childMR=()=>{
}
}

onDragStart = (coord) => {
onDragStart = (location) => {
const {
onDragStart,
} = this.props;

this.setState(() => {
return {
isSelected: true,

};
});

if (onDragStart !== null) {
onDragStart([
this.state.x,
Expand All @@ -342,10 +322,10 @@ childMR=()=>{
]);
}
}
onDrag = (coord) => {
onDrag = (location) => {
const {
isDraggable,
limitation,
windowBorder,
onDrag,
} = this.props;

Expand All @@ -354,14 +334,14 @@ childMR=()=>{
}

this.setState(() => {
const newX = this.state.x + coord[0];
const newY = this.state.y + coord[1];
const newX = this.state.x + location[0];
const newY = this.state.y + location[1];

if (limitation.x <= newX && limitation.w >= newX + this.state.w) {
if (windowBorder.x <= newX && windowBorder.w >= newX + this.state.w) {
this.state.x = newX;
}

if (limitation.y <= newY && limitation.h >= newY + this.state.h) {
if (windowBorder.y <= newY && windowBorder.h >= newY + this.state.h) {
this.state.y = newY;
}

Expand All @@ -375,19 +355,13 @@ childMR=()=>{
});
}

onDragEnd = (coord) => {
onDragEnd = (location) => {
const {
onDragEnd,
} = this.props;
const{
isBorder,
} = this.state;
this.setState(() => {
return {
isSelected: false,
};
});
this.isBorder();

this.isBorder();

if (onDragEnd !== null) {
onDragEnd([
this.state.x,
Expand Down Expand Up @@ -566,9 +540,9 @@ DragTextEditor.defaultProps = {
y: 0,
w: 200,
h: 200,
minW: 200,
minH: 200,
limitation: {
minWidth: 200,
minHeight: 200,
windowBorder: {
x: 0,
y: 0,
w: Dimensions.get('window').width,
Expand Down Expand Up @@ -602,9 +576,9 @@ DragTextEditor.propTypes = {
y: PropTypes.number,
w: PropTypes.any,
h: PropTypes.any,
minW: PropTypes.number,
minH: PropTypes.number,
limitation: PropTypes.shape({
minWidth: PropTypes.number,
minHeight: PropTypes.number,
windowBorder: PropTypes.shape({
x: PropTypes.number.isRequired,
y: PropTypes.number.isRequired,
w: PropTypes.number.isRequired,
Expand Down

0 comments on commit 5dc22ac

Please sign in to comment.