Windows mobile apps හදමු - Part 3

මේ ලිපියෙන් අපි component  ගැන ටිකක් කතා කරමු.app එකේ interface design එක හදාගන්න විදිය මම කියල දුන්නනේ.Solution explorer එකේ MainPage.xaml file එකේනේ interface design එක තියෙන්නේ.ඒක double click කරලා open කරලා ගත්තම design preview එකයි code එකයි දෙකම පෙන්නවා.වම් පැත්තේ තියෙන toolbox එකේ තමා components තියෙන්නේ.ඒවා select කරලා interface එකේ අදාළ තැන ඕනේ size එකට ඇඳ ගන්න ඕනේ

දැන් properties window එකෙන්(දකුණු කෙලවරේ පහල) ඒ component එකට අදාල properties වෙනස් කරගන්න පුළුවන්.

අංක 1 - name - මෙතන වැදගත්ම propertie එකක් තමා name එක.මෙතන දෙන name එකෙන් තමා code එකේදී component ඒක හදුනා ගන්නේ.දැන් බලමු interface එකයි code එකයි එකට අරගෙන

මෙතන <page> කියන ටැග් එකෙන් තමා මේ page එක පටන් අරන් තියෙන්නේ.</page> ටැග් එකෙන් තමා page එක ඉවර වෙන්නේ.මේ දෙක අතර තමයි අනිත් සේරම ලියන්න ඕනේ.HTML , XML දන්නා අයට නම් ටැග් කියන්නේ අමුතු දෙයක් නෙවේනේ.XAML කියන්නෙත් XMLම තමයි.Mark up language එකක්.

<Grid> </Grid>ටැග් වලින් කියල තියෙන්නේ screen එකේ layout එක කොහොම වෙන්න ඕනෙද කියල.මේකෙදි පාවිච්චි කරලා තියෙන්නේ Grid layout එකක්.ඒ දෙකට ඉහලින් තියෙන code වලින් කරලා තියෙන්නේ මේ file එකට අවශ්‍ය sources import කරගන්න එක.

layout එක ඇතුලෙ තමා අනිත් සේරම component තියෙන්නේ.අපිට ඕනේ නම් design එකේදී අදින්නේ නැතුව code එකේදී අතින් ලියල උනත් component දාගන්න පුළුවන්.

<Button x:Name="but1"
                HorizontalAlignment="Center" 
                 Height="60" Margin="0,400,0,0" 
                 Content="OK"
                 VerticalAlignment="Top" Width="100" 
        />

මේ code එක දාල බලන්න.button එකක් design වේවි මේ code එකට අදාලව

මුලින්ම බලමු textbox එකේ code ඒක ගැන

<TextBox x:Name="Text1"
                 HorizontalAlignment="Left"
                 Height="45" Margin="48,325,0,0"
                 TextWrapping="Wrap" Text=""
                 VerticalAlignment="Top" Width="300"

                 />

මේකෙදි ඔයාලට පෙනේවි එකම ටැග් ඒක ඇතුලේ code ටික දාල තියෙන බව.start ටැග් එකකුයි end ටැග් එකකුයි දෙකක් පාවිච්චි නොකර.එත් දෙකක් පාවිච්චි කරලත් දාන්න පුළුවන්.මෙන්න මෙහෙම

<TextBox x:Name="Text1"
                 HorizontalAlignment="Left"
                 Height="45" Margin="48,325,0,0"
                 TextWrapping="Wrap" Text=""
                 VerticalAlignment="Top" Width="300"
>

< /TextBox>

start ටැග් එකේදී තමයි මේ component එකට අදාල properties දෙන්න ඕනේ..

 x:Name="Text1" - component එකේ නම
HorizontalAlignment="Left" - තිරස් අතට align වෙන්න ඕනේ කොතෙන්ටද කියන එක
Height="45" - component එකේ උස
Margin="48,325,0,0" - component margin වල අගයන්
TextWrapping="Wrap"
Text="" - component ඒක මත පෙන්නන්න ඕනේ value එක
VerticalAlignment="Top"  - සිරස් අතට align වෙන්න ඕනේ කොතෙන්ටද කියන එක
Width="300" - component එකේ දිග

මම මේ ගත්තේ textbox එකක properties..දැන් බලමු button එකේ

x:Name="but1" - component එකේ නම
HorizontalAlignment="Center" - තිරස් අතට align වෙන්න ඕනේ කොතෙන්ටද කියන එක
Height="60" - component එකේ උස
Margin="0,400,0,0"  - component margin වල අගයන්
Content="OK" - component ඒක මත පෙන්නන්න ඕනේ value එක
VerticalAlignment="Top"  - සිරස් අතට align වෙන්න ඕනේ කොතෙන්ටද කියන එක
Width="100"  - component එකේ දිග

මේ දෙකේ component ඒක මත පෙන්නන්න ඕනේ value එක තියෙන්නේ textbox එකේ text කියන property එක විදිහට.button එකේ content කියල property එකක් විදිහට.අනිත් සේරම සමානයි..සමානයි කියන්නේ ඒවා හැම component එකටම පොදු properties අර වෙනස් උනේ component එකෙන් component එකට ආවේනික උන properties..ඊලග ලිපියෙන් xaml.cs file එක ගැන කතා කරමු