React Native的TextInput元件去掉下劃線和使用背景圖片
最近做RN,由於先做的是比較簡單的部分,所以沒碰到什麼難點。真正的難點還在後面,所以這周就記錄一下幾個小問題。也是比較常用的小問題了。
一、TextInput元件去掉下劃線和加上邊框
不得不說,RN自帶的TextInput輸入框是真的醜,不管是樣式還是什麼,所以我們根據美工圖做東西的時候,需要自己來做一些樣式。
1、去掉下劃線
如圖所示:
(1)maxLength大家都知道,是限制字數的
(2)underlineColorAdnroid:這是主要就是改變下劃線的透明度。
2、給輸入框加邊框
borderWidth:1,
borderColor:'#e8e8e8' ,
borderRadius:9,
直接加就好了,順便加了個弧形,更好看一些。
二、背景圖片的問題
剛開始要加背景圖片的時候,我以為是要在View檢視上加,還是慣性思維害死人啊,實際上RN的Image元件很強大
在最外圍來個Image元件,然後新增圖片路徑。在Image元件中寫上我們需要的檢視即可。
三、關於無資料的載入
加上無資料頁並不難,難的是不知道該在哪裡進行判斷。按理說只是一個if..else的問題,但是還是困擾了我一段時間
如圖所示:
1、我們在render渲染檢視的時候,可以在裡面進行一個判斷,當伺服器傳過來的資料為空,即undefined的時候就顯示無資料頁。當有資料的時候,就顯示我們的頁面。
2、return直接輸入我們寫好的頁面就行
3、我們在寫檢視的時候最好是分層次的寫。就像我這樣,維護起來比較好維護一些,一目瞭然。
這裡就是封裝的無資料頁檢視。很簡單,只需要把頁面寫上去就可以了。
好吧,,很簡單的分享,怪不好意思的,沒什麼乾貨。。
end
相關推薦
React Native的TextInput元件去掉下劃線和使用背景圖片
最近做RN,由於先做的是比較簡單的部分,所以沒碰到什麼難點。真正的難點還在後面,所以這周就記錄一下幾個小問題。也是比較常用的小問題了。 一、TextInput元件去掉下劃線和加上邊框 不得不說,RN自帶的TextInput輸入框是真的
如何去掉LinkButton控制元件的下劃線
<asp:LinkButton id="lbtnAdd" runat="server" style="TEXT-DECORATION: none">沒有下劃線的LinkButton</asp:LinkB
js 去掉下劃線,後首個字母變大寫
toupper 駝峰 uri family 大寫 var let upper 字母 1.駝峰轉連字符: var s = "fooStyleCss"; s = s.replace(/([A-Z])/g,"-$1").toLowerCase(); //利用正則進行替
43. fastjson處理下劃線和駝峰問題的方法和源碼分析
fastjson一. 前言在開發過程中經常遇到json解析和生成的問題,所以用自己也一直用fastjson來實現這個功能。但是,最近遇到一個問題: json字符串裏面的數據很多都是"_"下劃線的比如,op_id。而在java裏面,很多都是駝峰的寫法,如opId那這兩種可以匹配然後解析嗎?二. http請求的解
html 中文本去掉下劃線
圖片 自己 ges .com logs img 源代碼 src 文本 明顯看出,,網頁中文本的下劃線,怎麽去點呢;先看一下源代碼吧, 明顯看出,有下劃線的文本時超鏈接,我們可以通過 text-drection:"none"; 這個css樣式去掉 博主寫這個是因為自己
python 單下劃線和雙下劃線
base print 定義 gpo pass erl spa ble ... 1 underline.py 2 __all__ = [‘_underline_variable‘, ‘__underline_variable‘, ‘_underline_func‘,
SearchView去掉下劃線
下劃線 tde earch 屬性 div round 搜索 exc exceptio SearchView calSearchView = (SearchView) findViewById(R.id.sv_search_text); if (calSe
python(七) Python中單下劃線和雙下劃線
www www. 自己 pro improt 分類 鏈接 默認 question Python中單下劃線和雙下劃線: 一、分類 (1)、以單下劃線開頭,表示這是一個保護成員,只有類對象和子類對象自己能訪問到這些變量。 以單下劃線開
js正則表示式驗證字串只包括大小寫字母下劃線和-
背景說明 在之前的開發過程中為了校驗一個欄位只含有大小寫字母,下劃線和-花費了不少力氣才搞定,想著趕快寫一篇部落格來記錄下來,日後開發一定會遇到!! 程式碼實現 首先定義一個變數用來存放驗證字串的正則表示式:var regex=/^[A-Za-z0-9_\-]+$/ig;
Python中單下劃線和雙下劃線有啥區別
__func__:一種約定,Python內部的名字,用來區別其他使用者自定義的命名,以防衝突。 _func: 一種約定,用來指定私有變數或私有函式(private) __func: 如果類中有一個方法與另外一個類中的一個方法同名了
js下劃線和駝峰命名轉換
js下劃線和駝峰命名轉換 var s = "style-sheet-base"; var a = s.split("-"); var o = a[0]; for(var i=1;i<a.length;i++){ o = o + a[i].slice(0,1).toUpp
pycharm不顯示一部分下劃線和刪除線(pep8,typo引起)
如圖: 第一句的波浪線是因為因為了這個模組,而沒有使用的,也就是冗餘引起的,這個最好保留,因為可以提示你哪個模組沒有用到。第二句的下劃線是pep8標準不支援這樣的程式碼格式。如果不讓這個下劃線顯示出來可以依次選擇file--settings--搜尋框輸入pep:
只能輸入英文數字和下劃線和橫線的正則表示式
var reg="^[A-Za-z0-9-_]+$" ; var regus = new RegExp(regs); regus.test("所要驗證的字串") true 符合 false 不符合 中英文
Python類中的單下劃線和雙下劃線的區別
#"單下劃線" 開始的成員變數叫做保護變數,意思是隻有類物件和子類物件自己能訪問到這些變數; #"雙下劃線" 開始的是私有成員,意思是隻有類物件自己能訪問,連子類物件也不能訪問到 #-*-coding:utf8-*- class father(): def __init
JS物件去掉下劃線屬性
JS物件去掉下劃線屬性 最近在寫node端,所以遇到資料庫直接返回資料帶下劃線的情況 需要把下劃線屬性換成駝峰屬性 封裝了兩個方法 將下劃線換為駝峰 const replaceUnderLine = (val, char = '_') => {  
python的單下劃線和雙下劃線
python 類中的單下劃線開頭的變量表示:該方法為類的私有方法,原則上外部不能訪問,但是用._XX是可以訪問到的 雙下劃線開頭則是強制外部不能直接訪問的用.__XX是訪問不到的,它內部其實是將變數名重新命名為:_類名__變數名,所以可以通過._類名__變數名訪問 #_*_coding:utf-8_
react 父子元件之間的通訊和函式呼叫
reactjs是一枚新進小鮮肉,跟gulp搭配流行一段時間了。工作或者面試中經常遇到這樣的問題,“子元件如何向父元件傳值?”。其實很簡單,概括起來就是:react中state改變了,元件才會update。父寫好state和處理該state的函式,同時將函式名通過props屬性值的形式傳入子,子呼叫父的函式
href 中 # 與 java_Script:void(0) 的區別(去掉下劃線儲存不了,是CSDN的BUG嗎)
<a href="#"> 點選連結後,頁面會向上滾到頁首,# 預設錨點為 #TOP <a href="JavaScript:void(0)" onClick="window.open()"> 點選連結後,頁面不動,只打開連結 <a href=
react-native在windows下安裝和配置
zhu’yi本次安裝時基於windows7系統,32位,在虛擬機器上面安裝的。 1、安裝JDK,配置環境變數。 下載JDK,然後配置環境變數JAVA_HOME,還是按照正規路徑來,不然編譯時候找不到就尷尬了。 然後將%JAVA_HOME%\bin;%J
自定義View指示器讓指示器下劃線和文字對齊
指示器的標籤分為兩種情形,一種是固定的一般3~5個標籤,另一種的移動的標籤;開發中經常會使用MD風格的TabLayout控制元件,這個控制元件什麼都很好,就是指示器的下滑線和文字不能夠對齊,這一點用過的同學都會知道的,我也在網上找了好久,也找到不到現成的,只好自