React-native 仿微信發布圖片拖拽刪除

1.React-Native手勢系統

參考連接:

“指尖上的魔法” -- 談談React-Native中的手勢

React-Native ListView拖拽交換Item

2.利用手勢系統PanResponder開發圖片拖拽刪除Demo

要實現的效果如下圖所示:

shoushi.gif

代碼詳解:

1.如何布局

關鍵點:

  • 每個圖片view都是絕對定位,這樣才能脫離文檔流來進行拖拽操作,并且圖片整體區域距離頁面頂部200距離;
  • 每四個一行顯示,利用計算得出每張圖片的left值和top值。

我們把所有圖片資源存放在state中:

this.state = {
      imgs: [
        'https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=2908558741,1476032262&fm=27&gp=0.jpg',
        'https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=2660096790,1445343165&fm=27&gp=0.jpg',
        'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=586492344,3997176522&fm=27&gp=0.jpg',
        'https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=1138659146,799893005&fm=27&gp=0.jpg',
        'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=2634329296,2422503635&fm=27&gp=0.jpg',
        'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=2793821546,4232499990&fm=27&gp=0.jpg',
      ],
      showDelModal: false,
      delText: '拖拽此處可以刪除',
};

render方法:

render() {
    return (
      <View style={styles.imgContainer}>
        {
          this.state.imgs.map((v, i) => {
            let l = 0; // left
            let t = 0; // top
            if(i >= 0 && i <= 3){
              l = (10 + IMG_WIDTH)*i + 10;
            }else if(i > 3 && i <= 7){
              l = (10 + IMG_WIDTH)*(i - 4) + 10;
            }else if(i > 7){
              l = 10;
            };
            t = Math.floor(i/4)*(10+IMG_HEIGHT)+10 + 200;
            return (
              <View
                style={[styles.imageStyle, {left: l, top: t}]}
                {...this._panResponder.panHandlers}
                ref={ref => this.items[i] = ref}
                activeOpacity={0.2}
                key={i}
              >
                <TouchableOpacity onPress={() => this.pressImage(v, i)} style={[styles.imageStyle, {left: 0, top: 0}]}>
                  <Image  source={{uri: v}} style={[styles.imageStyle, {left: 0, top: 0}]} />
                </TouchableOpacity>
              </View>
            )
          })
        }
        
      </View>
    )
  }

其中:{...this._panResponder.panHandlers}是將手勢系統應用于當前View節點;ref={ref => this.items[i] = ref}是拿到每個View的DOM,因為我們要對每個View進行拖拽操作,通過ref可以設置它的style。

2.使用手勢系統

我們通常在componentWillMount生命周期中使用手勢系統:

componentWillMount(){
    this._panResponder = PanResponder.create({
        onStartShouldSetPanResponder: (evt, gestureState) => true,   
        onMoveShouldSetPanResponder: (evt, gestureState) => true,
        onPanResponderGrant: (evt, gestureState) => {// 手指觸碰屏幕那一刻觸發
           
        },
        onPanResponderMove: (evt, gestureState) => {// 手指移動過程中觸達
          
        },
        onPanResponderTerminationRequest: (evt, gestureState) => true,// 當有其他不同手勢出現,響應是否中止當前的手勢  
        onPanResponderRelease: (evt, gestureState) => {// 手指離開屏幕觸發

        },
        onPanResponderTerminate: (evt, gestureState) => { // 當前手勢中止觸發
          
        }
    });

實際上,我們只需要操作三個方法即可:

  • 手指觸發的時候,成為響應者,記錄此時的位置信息(onPanResponderGrant)
  • 手指移動過程中,根據計算移動信息,主要就是left、top值,來確定view的位置(onPanResponderMove)
  • 手指釋放的時候,根據位置信息來決定是否刪除該view,還是恢復原來的位置(onPanResponderRelease)

分別看一下每個方法的應用:

手指觸碰觸發的方法

onPanResponderGrant: (evt, gestureState) => {   // 手指觸碰屏幕那一刻觸發
            
            const {pageX, pageY, locationY, locationX} = evt.nativeEvent;  // pageY是相對于根節點的位置,locationY是相對于元素自己
            
            this.index = this._getIdByPosition(pageX, pageY);

            this.preY = pageY - locationY;   // 保存當前正確點擊item的位置,為了后面移動item
            this.preX = pageX - locationX;   // 保存當前正確點擊item的位置,為了后面移動item
            
            let item = this.items[this.index];

            item.setNativeProps({
                style: {
                    shadowColor: "#000",
                    shadowOpacity: 0.7,
                    shadowRadius: 5,
                    shadowOffset: {height: 4, width: 2},
                    elevation: 15,
                    zIndex: 999
                }
            });

            this.setState({
              showDelModal: true
            });

            // 刪除區域出來
            // this.slideAniValue.setValue(-60);
            Animated.timing(this.slideAniValue, {
                toValue: 0,
                duration: 300,
                easing: Easing.linear,// 線性的漸變函數
            }).start();

},

兩個參數: evt, gestureState

evt: 使用evt.nativeEvent可以拿到類似于web的event對象,常用的兩個屬性pageX, locationX,其中pageX代表手指相對于根節點的位置;locationX代表手指在當前元素的位置。

gestureState: 這個gestureState是一個對象,包含手勢進行過程中更多的信息,其中比較常用的幾個是:

  • dx/dy:手勢進行到現在的橫向/縱向相對位移
  • vx/vy:此刻的橫向/縱向速度
  • numberActiveTouches:responder上的觸摸的個數

1.this.index = this._getIdByPosition(pageX, pageY)這是為了得到到底觸摸了哪個view,然后可以通過this.index拿到他的dom對象;

2.this.preYthis.preX是保存當前點擊的view的位置,為了之后的拖拽移動做準備;

3.item.setNativeProps修改該dom屬性,使其突出顯示;

手指移動觸發的方法

onPanResponderMove: (evt, gestureState) => {
          
      let top = this.preY + gestureState.dy;
      let left = this.preX + gestureState.dx;
      let item = this.items[this.index];

      item.setNativeProps({
          style: {top: top, left: left},
      });
        
    if(top >= HEIGHT- IMG_HEIGHT - 60){ // 圖片進入刪除區域
              this.setState({
                delText: '松開刪除',
              });

            }else{
              this.setState({
                delText: '拖拽此處可以刪除'
              })
            }   
},

1.根據當前的手指位置,確定移動的view的位置;

2.移動到刪除區域,提示“松開刪除”,否則是“拖拽此處可以刪除”;

手指離開屏幕時觸發的方法

onPanResponderRelease: (evt, gestureState) => {  // 手指離開屏幕觸發

    this.setState({
      showDelModal: false
    });

    // 刪除區域隱藏
    // this.state.slideOutBottom.setValue(-60);
    Animated.timing(this.slideAniValue, {
        toValue: -60,
        duration: 300,
        easing: Easing.linear,// 線性的漸變函數
    }).start();

    if(this.state.delText == '松開刪除'){
      // 刪除圖片
      this.delImage(this.index);
    }else{

      const shadowStyle = {
          shadowColor: "#000",
          shadowOpacity: 0,
          shadowRadius: 0,
          shadowOffset: {height: 0, width: 0,},
          elevation: 0,
          zIndex: 1
      };
      let item = this.items[this.index];
      // 回到原來的位置
      item.setNativeProps({
          style: {...shadowStyle, top: this._getTopValueYById(this.index).top, left: this._getTopValueYById(this.index).left}
      });
    }
    
},

抬起手指的時候,需要做兩件事:

1.如果移動到刪除區域,松開就刪除當前view;

2.如果沒有移動到刪除區域就松開,那么恢復位置,刪除區域撤銷;

刪除照片的方法

delImage(index) {
    // 刪除照片
    this.imgDelAni(index);
    let cacheData = this.state.imgs;
    cacheData.splice(index,1);
    // 調整位置
    this.setState({
      imgs: cacheData
    });

    let l = 0; // left
    let t = 0; // top
    if(index>=0 && index<=3){
      l = (10+IMG_WIDTH)*index + 10;
    }else if(index>3 && index<=7){
      l = (10+IMG_WIDTH)*(index-4) + 10;
    }else if(index>7){
      l = 10;
    };
    t = Math.floor(index/4)*(10+IMG_HEIGHT)+10 + 200;

    this.items[index].setNativeProps({
      style: {
        left: l,
        top: t,
        zIndex: 1
      }
    })

  }

1.刪除照片,更新刪除后的照片數據;

2.重新調整位置;

根據view的index,來確定它的位置信息

_getTopValueYById(id) {
    
    let top = 0;
    let left = 0;

    if(id >= 0 && id <= 3){
      left = (10 + IMG_WIDTH)*id + 10;
    }else if(id > 3 && id <= 7){
      left = (10 + IMG_WIDTH)*(id - 4) + 10;
    }else if(id > 7){
      left = 10;
    };

    top = Math.floor(id/4)*(10+IMG_HEIGHT)+10 + 200;

    return {
      top,
      left
    }

  }

1.10表示圖片view之間的間距;

2.200表示圖片區域盒子距離也買你頂部的top值,并且必須是固定的;

根據手指的當前位置確定是哪一個圖片view

_getIdByPosition(pageX, pageY) {
    let w = IMG_WIDTH;
    let h = IMG_HEIGHT;
    let id = -1;

    if(pageY >= 210 && pageY <= 210 + h){
      // 在第一排點擊
      if(pageX >= 10 && pageX <= 10 + w){
        id = 0;
      }
      if(pageX >= 20 + w && pageX <= 20 + w + w){
        id = 1;
      }
      if(pageX >= 30 + 2*w){
        id = 2;
      }
      if(pageX >= 40 + 3*w){
        id = 3;
      }
    }
    if(pageY >= 210 + 20 + h && pageY <= 210 + 20 + h + h){
      // 在第二排點擊
      if(pageX >= 10 && pageX <= 10 + w){
        id = 4;
      }
      if(pageX >= 20 + w && pageX <= 20 + w + w){
        id = 5;
      }
      if(pageX >= 30 + 2*w){
        id = 6;
      }
      if(pageX >= 40 + 3*w){
        id = 7;
      }
    }

    if(pageY >= 210 + 20 + h + h + 10 && pageY <= 210 + 20 + h + h + 10 + h){
      // 在第三排點擊的
      if(pageX >= 10 && pageX <= 10 + w){
        id = 8;
      }
      
    }

    return id;
  }

完整代碼:

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import React, { Component } from 'react';
import {
  Platform,
  StyleSheet,
  Text,
  View,
  TouchableOpacity,
  BackHandler,
  Image,
  ViewPagerAndroid,
  DeviceEventEmitter,
  PanResponder,
  TouchableWithoutFeedback,
  Animated,
  Easing 
} from 'react-native';

import {WIDTH, HEIGHT} from '../utils/config';
import Button from '../components/Button';

const IMG_WIDTH = (WIDTH-52) / 4;
const IMG_HEIGHT = (WIDTH-40) / 4;

export default class ImageView extends Component<{}> {
  constructor(props){
    super(props);
    this.state = {
      imgs: [
        'https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=2908558741,1476032262&fm=27&gp=0.jpg',
        'https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=2660096790,1445343165&fm=27&gp=0.jpg',
        'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=586492344,3997176522&fm=27&gp=0.jpg',
        'https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=1138659146,799893005&fm=27&gp=0.jpg',
        'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=2634329296,2422503635&fm=27&gp=0.jpg',
        'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=2793821546,4232499990&fm=27&gp=0.jpg',
      ],
      showDelModal: false,
      delText: '拖拽此處可以刪除',
    };

    this.slideAniValue = new Animated.Value(-60);

    this.items = [];
  }
  static navigationOptions = ({navigation}) => {

    return {
      title: "照片拖拽刪除",
      
      headerLeft: (
        <TouchableOpacity >
          <Text style={styles.titleText} onPress={()=>navigation.goBack(null)}>返回</Text>
        </TouchableOpacity>
      )
    }
  }

  componentDidMount() {
    //注冊通知
    DeviceEventEmitter.addListener('ChangeImgData',(data)=>{
        //接收到詳情頁發送的通知,刷新首頁的數據,改變按鈕顏色和文字,刷新UI
        this.setState({
          imgs: data.imgData
        })
    });

  }

  pressImage(v, i) {
    const {navigation} = this.props;
    navigation.navigate('ImageShowScreen', {uri: v, index: i, images: this.state.imgs});
  } 

  _getIdByPosition(pageX, pageY) {
    let w = IMG_WIDTH;
    let h = IMG_HEIGHT;
    let id = -1;

    if(pageY >= 210 && pageY <= 210 + h){
      // 在第一排點擊
      if(pageX >= 10 && pageX <= 10 + w){
        id = 0;
      }
      if(pageX >= 20 + w && pageX <= 20 + w + w){
        id = 1;
      }
      if(pageX >= 30 + 2*w){
        id = 2;
      }
      if(pageX >= 40 + 3*w){
        id = 3;
      }
    }
    if(pageY >= 210 + 20 + h && pageY <= 210 + 20 + h + h){
      // 在第二排點擊
      if(pageX >= 10 && pageX <= 10 + w){
        id = 4;
      }
      if(pageX >= 20 + w && pageX <= 20 + w + w){
        id = 5;
      }
      if(pageX >= 30 + 2*w){
        id = 6;
      }
      if(pageX >= 40 + 3*w){
        id = 7;
      }
    }

    if(pageY >= 210 + 20 + h + h + 10 && pageY <= 210 + 20 + h + h + 10 + h){
      // 在第三排點擊的
      if(pageX >= 10 && pageX <= 10 + w){
        id = 8;
      }
      
    }

    return id;
  }

  _getTopValueYById(id) {
    
    let top = 0;
    let left = 0;

    if(id >= 0 && id <= 3){
      left = (10 + IMG_WIDTH)*id + 10;
    }else if(id > 3 && id <= 7){
      left = (10 + IMG_WIDTH)*(id - 4) + 10;
    }else if(id > 7){
      left = 10;
    };

    top = Math.floor(id/4)*(10+IMG_HEIGHT)+10 + 200;

    return {
      top,
      left
    }

  }

  componentWillMount(){
    this._panResponder = PanResponder.create({
        onStartShouldSetPanResponder: (evt, gestureState) => true,   
        onMoveShouldSetPanResponder: (evt, gestureState) => true,
        onPanResponderGrant: (evt, gestureState) => {   // 手指觸碰屏幕那一刻觸發
            
            const {pageX, pageY, locationY, locationX} = evt.nativeEvent;  // pageY是相對于根節點的位置,locationY是相對于元素自己
            
            this.index = this._getIdByPosition(pageX, pageY);

            this.preY = pageY - locationY;   // 保存當前正確點擊item的位置,為了后面移動item
            this.preX = pageX - locationX;   // 保存當前正確點擊item的位置,為了后面移動item
            
            let item = this.items[this.index];

            item.setNativeProps({
                style: {
                    shadowColor: "#000",
                    shadowOpacity: 0.7,
                    shadowRadius: 5,
                    shadowOffset: {height: 4, width: 2},
                    elevation: 15,
                    zIndex: 999
                }
            });

            this.setState({
              showDelModal: true
            });

            // 刪除區域出來
            // this.slideAniValue.setValue(-60);
            Animated.timing(this.slideAniValue, {
                toValue: 0,
                duration: 300,
                easing: Easing.linear,// 線性的漸變函數
            }).start();

        },
        onPanResponderMove: (evt, gestureState) => {
          
            let top = this.preY + gestureState.dy;
            let left = this.preX + gestureState.dx;
            let item = this.items[this.index];

            item.setNativeProps({
                style: {top: top, left: left},
            });

            if(top >= HEIGHT- IMG_HEIGHT - 60){ // 圖片進入刪除區域
              this.setState({
                delText: '松開刪除',
              });

            }else{
              this.setState({
                delText: '拖拽此處可以刪除'
              })
            }
        },
        onPanResponderTerminationRequest: (evt, gestureState) => true,   // 當有其他不同手勢出現,響應是否中止當前的手勢  
        onPanResponderRelease: (evt, gestureState) => {  // 手指離開屏幕觸發

            this.setState({
              showDelModal: false
            });

            // 刪除區域隱藏
            // this.state.slideOutBottom.setValue(-60);
            Animated.timing(this.slideAniValue, {
                toValue: -60,
                duration: 300,
                easing: Easing.linear,// 線性的漸變函數
            }).start();

            if(this.state.delText == '松開刪除'){
              // 刪除圖片
              this.delImage(this.index);
            }else{

              const shadowStyle = {
                  shadowColor: "#000",
                  shadowOpacity: 0,
                  shadowRadius: 0,
                  shadowOffset: {height: 0, width: 0,},
                  elevation: 0,
                  zIndex: 1
              };
              let item = this.items[this.index];
              // 回到原來的位置
              item.setNativeProps({
                  style: {...shadowStyle, top: this._getTopValueYById(this.index).top, left: this._getTopValueYById(this.index).left}
              });
            }
            
        },
        onPanResponderTerminate: (evt, gestureState) => {    // 當前手勢中止觸發
          
        }
    });

  }

  imgDelAni(index) {
    
  }

  delImage(index) {
    // 刪除照片
    this.imgDelAni(index);
    let cacheData = this.state.imgs;
    cacheData.splice(index,1);
    // 調整位置
    this.setState({
      imgs: cacheData
    });

    let l = 0; // left
    let t = 0; // top
    if(index>=0 && index<=3){
      l = (10+IMG_WIDTH)*index + 10;
    }else if(index>3 && index<=7){
      l = (10+IMG_WIDTH)*(index-4) + 10;
    }else if(index>7){
      l = 10;
    };
    t = Math.floor(index/4)*(10+IMG_HEIGHT)+10 + 200;

    this.items[index].setNativeProps({
      style: {
        left: l,
        top: t,
        zIndex: 1
      }
    })

  }

  render() {
    return (
      <View style={styles.imgContainer}>
        {
          this.state.imgs.map((v, i) => {
            let l = 0; // left
            let t = 0; // top
            if(i >= 0 && i <= 3){
              l = (10 + IMG_WIDTH)*i + 10;
            }else if(i > 3 && i <= 7){
              l = (10 + IMG_WIDTH)*(i - 4) + 10;
            }else if(i > 7){
              l = 10;
            };
            t = Math.floor(i/4)*(10+IMG_HEIGHT)+10 + 200;
            return (
              <View
                style={[styles.imageStyle, {left: l, top: t}]}
                {...this._panResponder.panHandlers}
                ref={ref => this.items[i] = ref}
                activeOpacity={0.2}
                key={i}
              >
                <TouchableOpacity onPress={() => this.pressImage(v, i)} style={[styles.imageStyle, {left: 0, top: 0}]}>
                  <Image  source={{uri: v}} style={[styles.imageStyle, {left: 0, top: 0}]} />
                </TouchableOpacity>
              </View>
            )
          })
        }

        <Animated.View style={[styles.delWraper, {bottom: this.slideAniValue}]}>
          <Text style={{color: '#fff'}}>{this.state.delText}</Text>
        </Animated.View>

        {
          this.state.showDelModal &&
          <View style={styles.shadowModal}></View>
        }
        
      </View>
    )
  }
}

const styles = StyleSheet.create({
  imgContainer: {
    flex: 1
  },
  imageStyle: {
    width: IMG_WIDTH,
    height: IMG_HEIGHT,
    position: 'absolute',
    borderRadius: 3,
  },
  delWraper:{
    width: WIDTH,
    height: 60,
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: 'red',
    position: 'absolute',
    // bottom: 0,
    left: 0,
    zIndex: 998
  },
  shadowModal:{
    width: WIDTH,
    height: HEIGHT,
    position: 'absolute',
    backgroundColor: '#000',
    opacity: 0.4,
    zIndex: 888,
    bottom: 0,
    left: 0,
  }
});

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 228,461評論 6 532
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,538評論 3 417
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 176,423評論 0 375
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 62,991評論 1 312
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,761評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,207評論 1 324
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,268評論 3 441
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,419評論 0 288
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 48,959評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,782評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,983評論 1 369
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,528評論 5 359
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,222評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,653評論 0 26
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,901評論 1 286
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,678評論 3 392
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,978評論 2 374

推薦閱讀更多精彩內容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,660評論 25 708
  • 發現 關注 消息 iOS 第三方庫、插件、知名博客總結 作者大灰狼的小綿羊哥哥關注 2017.06.26 09:4...
    肇東周閱讀 12,151評論 4 61
  • 有時候,就是這么一個瞬間,我害怕,害怕失去表達內心的能力,我怕我找不到文字來形容來釋放,來展示我內心深處那些零零碎...
    子嫣ziyan閱讀 155評論 0 1
  • 翻了翻微信通訊錄 不自覺的點開一些人的微信名片 這些人里, 有我羨慕的,我觸不及的,還有好久不聯系到我覺得他們應該...
    青城FM閱讀 389評論 0 0
  • 今天死黨在微信群里問——“我們省比較好的2A學校有哪些啊?” 我覺得有點奇怪,我知道她表弟今年高考,但分數明天才出...
    江阿越閱讀 203評論 0 0