基于微信小程序的表達式計算器的設計與實現

趙素萍

（晉中信息學院 山西省晉中市 030800）

本項目將字符串分割為數和運算符兩個數組，從運算符的第一個數組元素開始，先進行乘除的運算，即從左到右，將所有的乘除運算計算完，再進行第二次循環，計算所有的加減。本文從此觀點出發，設計并實現了計算器的表達式求值。不使用棧而是直接將對字符串進行操作，可實現表達式的實時計算。通過實驗發現，該方法能大大提高計算的執行效率。

1 頁面布局

本項目采用的是flex布局。Flex（Flexible Box）為”彈性布局”，用來為盒狀模型內容的容器成員項提供最大的靈活性。具體使用方法為將容器的顯示方式設置為flex，為容器成員分配其占比即可。

頁面樣式中較難的為flex布局，但只要掌握了基礎知識，即找到對應的容器和項目，并為容器設置顯示方式和顯示方向；為項目設置各自的所占比例即可，寫代碼就會變的很容易。為了更好的理解代碼，程序員必須充分了解并熟練掌握調試器的使用，最終運行時調試器中顯示的wxml結構如圖1所示。

根據圖1可以看出，小程序進行渲染時，結構文件中的所有內容都會被包含到這樣一對組件中，所有在該項目中，可以將page視為容器，顯示屏與按鈕為其成員，可靈活分配占比，本項目中采用的2:3。Page的樣式設置為flex布局方式，flex方向設置為縱向布局；容器成員設置為1:1即可。參考代碼如下：

圖1：計算器結構

page{display：flex；flex-direction：column；}

.num{flex：2}

.btns{flex：3}

顯示區域不需要采用flex布局，只需要采用絕對定位方式將其放置到合理的位置即可。即表達式和結果的樣式設置為“display：absolute；……