小程序中頁面布局和絕對定位以及按鈕的實現(xiàn)示例

這篇文章主要介紹了小程序中頁面布局和絕對定位以及按鈕的實現(xiàn)示例，具有一定借鑒價值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

  <view class="dibu">
  <input  value='{{inputVal}}' bindinput='inputTyping' class="wz" bindinput='inputTyping' placeholder="請輸入私信內(nèi)容" placeholder-style='color:#bdbdbd;line-height:68rpx;margin-left:30rpx;font-size:30rpx;' />
  <view bindtap="blurfocus" class="fasong">發(fā)送</view>
  </view>

.dibu{
position:fixed;
bottom:2px;
float:left;
border:2px solid #f5f5f5;
width:99%;
height:70rpx;
background:white;
}

.wz{
    /* border:1px solid red; */
height:68rpx;
font-size:46rpx;
width:630rpx;
float:left;
border:1px solid #8EE5EE;
border-radius:10rpx;
}
.fasong{
    float:right;
height:70rpx;
margin-right:7rpx;
width:90rpx;
line-height:66rpx;
text-align:center;
border-radius:10rpx;
font-size:28rpx;
background:#8EE5EE;

}

分享必須用button，但要自定義button（style="border:0;" plain="true"  open-type="share"）

<view class="viewh" wx:if="{{sharpicture==4}}">
    <view class="tp"><image class="tpimg" src="../../static/images/yqxg.png"/></view>
    <view class="imgtxt">你粗糙紋理好過<text style="font-size:60rpx;">{{facedata.defaultdata.wenli}}%</text>的人
    </view>
    <button class="share" style="border:0;" plain="true"  open-type="share">
   <image  src="../../static/images/share.png"/></button>
</view>

分享必須帶好參數(shù)，不然別人不到 都是空白或頁面不存在

 onShareAppMessage: function (ops) {
        console.log('分享了');

        if (ops.from === 'button') {
            // 來自頁面內(nèi)轉(zhuǎn)發(fā)按鈕
            console.log(ops.target)
        }
        return {
            title: '哈哈哈',
            path: '/pages/facialEvaluate/facialEvaluate?faceFourdataId=' + this.data.faceFourdataId +'&userId='+this.data.userId,
           //path:'',
            success: function (res) {
                // 轉(zhuǎn)發(fā)成功
                console.log("轉(zhuǎn)發(fā)成功:" + JSON.stringify(res));
            },
            fail: function (res) {
                // 轉(zhuǎn)發(fā)失敗
                console.log("轉(zhuǎn)發(fā)失敗:" + JSON.stringify(res));
            }
        }

    },

感謝你能夠認真閱讀完這篇文章，希望小編分享的“小程序中頁面布局和絕對定位以及按鈕的實現(xiàn)示例”這篇文章對大家有幫助，同時也希望大家多多支持億速云，關(guān)注億速云行業(yè)資訊頻道，更多相關(guān)知識等著你來學習!