Flutter--RenderObject之獲取widget定位坐標

一、RenderObject定義

官方定義,RenderObject : An object in the render tree.即渲染樹中的一個對象,負責布局及繪制。

二同窘、Widget 、Element 部脚、RenderObject 關系
三樹圖.png

Widget 描述 Element 的配置信息想邦,是 Flutter 框架里的核心類層次結構,一個 Widget 是用戶界面某一部分的不可變描述委刘。Widgets 可以轉為 Elements丧没,Elements 管理著底層的渲染樹鹰椒。

  • Widget實際上就是Element的配置數(shù)據(jù),Widget樹實際上是一個配置樹呕童,而真正的UI渲染樹是由Element構成漆际。Widget只是描述顯示元素的一個配置數(shù)據(jù),真正代表屏幕上顯示元素的類是Element夺饲。一個Widget對象可以對應多個Element對象奸汇。(相同的widget可以同時存在)
  • UI樹由一個個獨立的Element節(jié)點構成。組件最終的顯示往声、渲染都是通過RenderObejct來完成的擂找,
  • 從創(chuàng)建到渲染的大體流程是:根據(jù)Widget生成Element,然后創(chuàng)建相應的RenderObejct并關聯(lián)到Element.renderObject屬性上浩销,最后再通過RenderObject來完成布局排列和繪制贯涎。他們的依賴關系是:Element樹根據(jù)Widget樹生成,而渲染樹又依賴于Element樹慢洋。
三柬采、利用RenderObject獲取widget定位

我們可以知道最終頁面的顯示、渲染是根據(jù)renderObject來確定的且警,所以可以利用renderObject的屬性findRenderObject()來獲取widget的定位坐標。

1.給需要定位的組件添加GlobalKey

GlobalKey _globalKey = new GlobalKey();
 TextField(
          key: _globalKey,
          style: TextStyle(
                          fontSize: 15.0,
                          color: Colors.black),
                          textInputAction: TextInputAction.next,     
)                              

2.獲取組件坐標

RenderBox renderObject = _globalKey.currentContext.findRenderObject();
var offset =  renderBox.localToGlobal(Offset.zero); //組件坐標
var underOffset =  renderBox.localToGlobal(Offset(0.0, renderBox.size.height)); //組件下方坐標
var coordinate_x=offset.dx; //x坐標
var coordinate_y=offset.dy; //y坐標
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末礁遣,一起剝皮案震驚了整個濱河市斑芜,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌祟霍,老刑警劉巖杏头,帶你破解...
    沈念sama閱讀 218,858評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異沸呐,居然都是意外死亡醇王,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,372評論 3 395
  • 文/潘曉璐 我一進店門崭添,熙熙樓的掌柜王于貴愁眉苦臉地迎上來寓娩,“玉大人,你說我怎么就攤上這事呼渣〖椋” “怎么了?”我有些...
    開封第一講書人閱讀 165,282評論 0 356
  • 文/不壞的土叔 我叫張陵屁置,是天一觀的道長焊夸。 經常有香客問我,道長蓝角,這世上最難降的妖魔是什么阱穗? 我笑而不...
    開封第一講書人閱讀 58,842評論 1 295
  • 正文 為了忘掉前任饭冬,我火速辦了婚禮,結果婚禮上揪阶,老公的妹妹穿的比我還像新娘昌抠。我一直安慰自己,他們只是感情好遣钳,可當我...
    茶點故事閱讀 67,857評論 6 392
  • 文/花漫 我一把揭開白布扰魂。 她就那樣靜靜地躺著,像睡著了一般蕴茴。 火紅的嫁衣襯著肌膚如雪劝评。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,679評論 1 305
  • 那天倦淀,我揣著相機與錄音蒋畜,去河邊找鬼。 笑死撞叽,一個胖子當著我的面吹牛姻成,可吹牛的內容都是我干的。 我是一名探鬼主播愿棋,決...
    沈念sama閱讀 40,406評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼科展,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了糠雨?” 一聲冷哼從身側響起才睹,我...
    開封第一講書人閱讀 39,311評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎甘邀,沒想到半個月后琅攘,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經...
    沈念sama閱讀 45,767評論 1 315
  • 正文 獨居荒郊野嶺守林人離奇死亡松邪,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 37,945評論 3 336
  • 正文 我和宋清朗相戀三年坞琴,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片逗抑。...
    茶點故事閱讀 40,090評論 1 350
  • 序言:一個原本活蹦亂跳的男人離奇死亡剧辐,死狀恐怖,靈堂內的尸體忽然破棺而出邮府,到底是詐尸還是另有隱情浙于,我是刑警寧澤,帶...
    沈念sama閱讀 35,785評論 5 346
  • 正文 年R本政府宣布挟纱,位于F島的核電站羞酗,受9級特大地震影響,放射性物質發(fā)生泄漏紊服。R本人自食惡果不足惜檀轨,卻給世界環(huán)境...
    茶點故事閱讀 41,420評論 3 331
  • 文/蒙蒙 一胸竞、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧参萄,春花似錦卫枝、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,988評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至筒溃,卻和暖如春马篮,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背怜奖。 一陣腳步聲響...
    開封第一講書人閱讀 33,101評論 1 271
  • 我被黑心中介騙來泰國打工浑测, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人歪玲。 一個月前我還...
    沈念sama閱讀 48,298評論 3 372
  • 正文 我出身青樓迁央,卻偏偏與公主長得像,于是被迫代替她去往敵國和親滥崩。 傳聞我的和親對象是個殘疾皇子岖圈,可洞房花燭夜當晚...
    茶點故事閱讀 45,033評論 2 355