برنامه نویسیجاوامیم تک 25

GridPane : بررسی Layout های جاوا FX (قسمت هشتم)

GridPane : بررسی Layout های جاوا FX (بخش هشتم)
مقدمه :

در سلسله مقالات layout ها در جاوا FX به معرفی و بررسی انواع Layout ها در جاوا FX از قبیل HBox ، VBox ، BorderPane ، TilePane ، FlowPane ، StackPane ، AnchorePane و TextFlow پرداختیم. در این مقاله می خواهیم در مورد GridPane صحبت کنیم. به طور خلاصه می توان گفت در این layout می توان نودهای فرزند  در یک شبکه ی انعطاف پذیر از سطر و ستون قرار داد. یکی از بهترین layout ها برای نوشتن برنامه های  responsive است. طبق معمول ما از جزئیات صحبت می کنیم اما به خاطر سپاری تک تک آن ها الزامی نیست.

امیدواریم این مقاله به شما در انتخاب layout مناسب کمک کند.

GridPane :

 همانطور که گفته شد GridPane نودهای فرزند را در یک شبکه انعطاف پذیر از ردیف ها و ستون ها قرار می دهد. اگر border یا  padding برای layout تنظیم شده باشد، محتوای آن در داخل آن درج می شود. هر نود فرزند می تواند در هر نقطه از سطر و ستون ها قرار گیرد. همچنین می تواند چند سطر و ستون را به خود اختصاص دهد. سطر و ستون نودها می توانند باهم هم پوشانی داشته باشند. در صورت همپوشانی سطر و ستون ها  دستور مرتب سازی آنها بر اساس ترتیب ورود آن ها به GridPane است. به این صورت که اولین عضو وارد شده به grid پایین ترین نود در نظر گرفته می شود.

قیدهای افزودن نود به GridPane :

برای اضافه کردن نود به GridPane باید شماره و تعداد سطر و ستون را برای آن ها مشخص کنیم.

  • شماره سطر/ستون : شماره سطر/ستون که قرار گرفتن نود از آن آغاز می شود.
  • تعداد سطر/ ستون : تعداد ستون/سطر هایی که می خواهیم نود به صورت افقی/عمودی در آن ها قرار بگیرد.

نکته 1 : اگر شماره سطر یا ستون را مشخص نکنیم سطر یا ستون اول را به نود اختصاص می دهد.
نکته 2 : اگر تعداد سطر و ستون مربوط به نود را مشخص نکنیم مقدار پیش فرض آن یک است.
نکته 3 : محل قرارگیری نودها به صورت دینامیک قابل تغییر است. بر اساس این تغییرات GridPane هم آپدیت می شود.

تعیین سایز سطر و ستون :

در حالت پیش فرض عرض یک ستون به اندازه ای است که عریض ترین فرزندش را در خود جای دهد. به همین ترتیب طول یک سطر به اندازه ی بلندترین طول فرزندانش می باشد.

البته می تواند سایز سطر و ستون را به صورت ثابت تعیین کرد.

در یک GridPane سایز سطر و ستون برابر با سایز pref (چه بر اساس محتوا محاسبه شده باشد چه مقدار ثابت گرفته باشد) آن ها می باشد حتی اگر  سایز GridPane از سایز pref خود بزرگتر شود. وقتی GridPane از اندازه ی pref  خود بزرگتر شود چون سایز سطر و ستون ها تغییر نمی کند در نتیجه فضای خالی ایجاد می شود. اگر می خواهیم سطر یا ستون خاصی این فضای خالی را پر کند می توانیم از تنظیم ویژگی growPriority در آن سطر و ستون استفاده کنیم.

نکته ی مهم : در ابتدای بخش گفتیم سایز سطر و ستون بر اساس سایز فرزندان تنظیم می شود. اگر برای یک تعداد سطر یا ستون بیشتر از یک باشد اولویت افزایش سایز آن ها برای جای دادن نود فرزند ابتدا با ستون/سطری که growPriority دارد و سپس با سطر/ ستون آخر است.

روش دیگر برای تنظیم سایز سطر/ستون به صورت درصدی است. به این صورت که می‌توانیم تعیین کنیم هر سطر یا ستون چه درصدی از فضای GridPane را پر کند.

نکته 1 : اگر جمع درصد ها بیشتر از 100 شود، نسبت گرفته می شود. به این ترتیب که  درصد ها به مجموع آن ها تقسیم می شود و درصدهای جدید محاسبه می شود.

نکته 2 : اولویت سایز درصدی بالاتر از هر مدل تنظیم سایز هست. در صورت انجام تعیین سایز با درصد تمام شیوه های تنظیم سایز دیگر کنسل می شود.

روش آخر برای تعیین سایز روش ترکیبی است. به این صورت که ابتدا فضای GridPane به سطر و ستون هایی که به صورت درصدی سایز آن ها تعیین شده است اختصاص می یابد سپس فضای باقی مانده بین بقیه سطر و ستون ها که به شیوه های دیگه سایزشان تعیین شده تقسیم می شود.

رنج تغییرات سایز در :

پدر یک نود GridPane ، می تواند سایز آن را بر اساس رنج تغییرات سایزش تغییر دهد. رنج تغییرات سایز GridPane بدون دخالت برنامه نویس قابل تعیین است. این کار زمانی انجام می شود که  برنامه نویس اقدام به تعیین سایز نکرده باشد و مقدار سایز ها،  مقدار پیش فرض USE_COMPUTED_SIZE باشد.

در این صورت نحوه ی محاسبه ی سایز های minimum، maximum و preferred به صورت زیر است :

  1. minimum :
    • عرض : جمع فاصله ها از چپ و راست + جمع عرض minimum همه ستون ها
    • طول : جمع فاصله ها از پایین و بالا+  جمع طول minimum همه سطر ها
  2. preferred :
    •  عرض: جمع فاصله ها از چپ و راست  +  جمع عرض preferred همه ستون ها
    •  طول: جمع فاصله ها از پایین و بالا +  جمع طول preferred همه سطر ها
  3. maximum :
    • عرض : Double.MAX_VALUE
    •  طول : Double.MAX_VALUE

نکته1 : این مقادیر توسط برنامه نویس با فراخوانی توابع setter مربوطه نیز قابل تنظیم است.

نکته2: Double.MAX_VALUE  به معنی بدون محدودیت است. اگر سایز maximum بدون محدودیت باشد، تمام فضایی که نود پدر در اختیارش قرار می دهد را پر می کند.

مدل دهی :

پس زمینه  و حاشیه (border) در این layout،  با استفاده از css قابل طراحی هستند.

حالت های خاص :

در GridPane قیدهای زیر را  می توان آن ها را به یک نود به صورت خاص اعمال کرد.

  • margin : امکان تعریف فضای خالی اطراف یک نود خاص
  • halignment :  تراز کردن عمودی یک نود
  • valignment : تراز کردن افقی یک نود
  • hgrow : تنظیم اولویت رشد عرضی برای یک نود خاص
  • vgrow :   تنظیم اولویت رشد عرضی برای یک نود خاص

نکته1 :  نودهای معمولا بر اساس شیوه ی تراز شدن سطر و ستون تراز می شوند. اگر برای یک نود این مقدار را بصورت خاص تعیین کنیم روی مقادیر سطر و ستون باز نویسی می شود ولی بقیه فرزندان به روال قبل هستند.

نکته2 : growPriority فقط روی کل سطر و ستون اعمال می شود اگر فقط برای یک نود فرزند تنظیم بشود از آن برای مقدار دهی کل ستون و سطر استفاده می‌شود. priority تنظیم شده روی سطر و ستون بازنویسی میشه روی priority مربوط به محتوا.

ارسال پاسخ