10 11

Визуаль Програмчлал 1
Програмын интерфейсийг өргөтгөх
лекц 10,11
Багш Д.Ганцоож

Хичээлийн агуулга
 ImageList
 TreeView
 ListView
 DateTimePicker
 ProgressBar
 NotifyIcon
 WebBrowser

ImageList компонент
 Хэрэглээ
 ImageList компонент нь бусад контролд ашиглагдах
зургийн цуглуулгыг агуулах үүрэгтэй.
 Дангаараа ашиглагдах боломжгүй, бусад контролуудтай
хамт хэрэглэгдэнэ.
 Тайлбар
 Энэ компонентийг бусад контролтой ашиглахдаа тухайн
контролын ImageList гэсэн шинжид тухайн ImageList
компонентийнхоо нэрийг тодорхойлно.

ImageList компонент
 Images – тухайн контрол дахь зургийн цуглуулга буюу
олонлогийг агуулна.
 Add() – цуглуулгад зураг нэмэх
 RemoveAt() – цуглуулгаас зураг устгах /индексээр
 RemoveByKey() – цуглуулгаас зураг устгах /түлхүүрээр
 Count() – цуглуулга дахь зургийн тоог буцаана.
 SetKeyName() – цуглуулга дахь зурганд түлхүүр утга
тодорхойлох
 ContainsKey() – цуглуулгад тодорхойлсон түлхүүртэй зураг
байгаа эсэхийг тодорхойлно.
 Clear() – цуглуулгыг цэвэрлэнэ.
 ImageSize – зургийн цуглуулга дахь зургийн хэмжээг
тодорхойлно, буцаана.

ImageList компонентийн чухал гишүүд
Жишээ 1:
ImageList imglist = new ImageList();
imglist.ImageSize = new Size(16, 16);
imglist.Images.Add(Image.FromFile(@"C:UsersPublicPicture
sSample PicturesChrysanthemum.jpg"));
imglist.Images.Add(Image.FromFile(@"C:UsersPublicPictures
Sample PicturesDesert.jpg"));
imglist.Images.Add(Image.FromFile(@"C:UsersPublicPicture
sSample PicturesKoala.jpg"));
imglist.Images.SetKeyName(0, "cut");
imglist.Images.SetKeyName(1, "copy");
imglist.Images.SetKeyName(2, "paste");
imglist.Images.ContainsKey("cut");

ImageList компонентийн чухал гишүүд
Жишээ :
int i = imglist.Images.Count;
imglist.Images.RemoveAt(1);
imglist.Images.RemoveByKey("copy");
imglist.Images.Clear();

TreeView контрол
 TreeView контрол нь өгөгдлийн мод хэлбэрээр харуулах
үүрэгтэй.
 Мод нь эх зангилаа, хүү зангилаануудаас тогтоно.
 Тайлбар
 Зангилаа бүр нь TreeNode объект байна.
 Зангилаа объектод зураг харуулах тохиолдолд ImageList
компоненттой хамг ашиглагдана.

TreeView контролын чухал гишүүд
 Nodes – TreeView контрол дахь зангилаануудын
олонлог буюу зангилаануудын цуглуулга.
 Энэ олонлогт тодорхойлогдох зангилаанууд нь
TreeNode төрлийн объектууд байна.
 TreeView контрол дахь зангилаануудтай ажиллахдаа
дараах методуудыг ашиглана.
 Add(), Insert() – зангилаа нэмэх, оруулах
 Remove(), RemoveAt(), RemoveByKey() – зангилаа устгах
 Contains(), ContainsKey() – зангилаа байгаа эсэхийг
тодорхойлох
 Clear() – бүх зангилааг устгах
 Count() – зангилааны тоог буцаах

 ImageList – тухайн контролд ашигдагдах зургийн
цуглуулгыг агуулсан ImageList компонентийг
 LineColor – зангилаануудыг холбосон шугамны өнгийг
тодорхойлно.
 ShowLines – зангилаануудыг холбосон шугамыг
харуулах эсэхийг тодорхойлно.
 ShowPlusMinus – зангилаануудын өмнөх +, -
тэмдэгийг харуулах эсэхийг тодорхойлно.
 SelectedNode – сонгогдсон зангилааг тодорхойлно,
буцаана.

 Expand(), ExpandAll() – зангилуунуудыг дэлгэх буюу
задлана.
 Collapse() – зангилаануудыг хумих буюу хураана.
 BeforeExpand(), AfterExpand() – зангилааг задлахаас
өмнө ба дараа үүсэх үзэгдэл
 BeforeCollapse(), AfterCollapse() – зангилааг
хураахаас өмнө ба дараар үүсэх үзэгдэл
 BeforeSelect(), AfterSelect() – зангилааг сонгохоос
өмнө ба дараа үүсэх үзэгдэл

 Text – зангилааны текст утгыг тодорхойлно, буцаана.
 Index – зангилааны индексийг буцаана.
 Name – зангилааны нэрийг тодорхойлно, буцаана.
 ImageIndex, ImageKey – зангилааны зургийг
 SelectedImageIndex, SelectedImageKey – зангилааг
сонгогдох үед харагдах зургийг тодорхойлно, буцаана.
 FullPath – сонгогдсон зангилааны замыг буцаана.

 Level – зангилааны түвшинг буцаана. Үндэс нь 0
түвшин
 Nodes – тухайн зангилаан дахь зангилаануудын
олонлог
 Parent – зангилааны эх зангилааг буцаана.
 FirstNode, LastNode – хамгийн эхний ба хамгийн
сүүлчийн зангилааг буцаана.
 PrevNode, NextNode – тухайн зангилааны өмнөх ба
дараах зангилааг буцаана.
 IsExpanded – тухайн дэлгэгдсэн эсэхийг буцаана.
 IsSelected – тухайн зангилаа сонгогдсон эсэхийг
буцаана.

Жишээ:
ImageList imglist = new ImageList();
imglist.ImageSize = new Size(16, 16);
imglist.Images.Add(Image.FromFile(@"C:UsersPublicPicturesSample
PicturesChrysanthemum.jpg"));
imglist.Images.Add(Image.FromFile(@"C:UsersPublicPicturesSample
PicturesDesert.jpg"));
treeView1.ImageList = imglist;
TreeNode one = new TreeNode();
one.Text = "Нэг";
TreeNode two = new TreeNode("Хоёр");
TreeNode three = new TreeNode("Гурав",0,1);

Жишээ үргэлжлэл:
TreeNode[] nodeArray = { one, two, three};
TreeNode four = new TreeNode("Дөрөв", nodeArray);
treeView1.Nodes.Add(four);
treeView1.LineColor = Color.Blue;
treeView1.ExpandAll();

private void treeView1_AfterSelect(object sender, TreeViewEventArgs
e)
{
MessageBox.Show(e.Node.Level.ToString());
}

ListView контрол
 ListView контрол нь мэдээллийг зурагтай жагсаалт
хэлбэрээр харуулах бөгөөд жагсаалтын харагдах хэлбэрийг
өөрчлөн сонгох боломж олгоно.
 Тайлбар
 ListView контрол нь ListViewItem төрлийн объектуудыг
агуулна.
 ListView контрол нь ListViewItem төрлийн элементүүдийг 5
хэлбэрээр харуулах боломжийг олгоно.

ListView контролын чухал гишүүд
 Items – ListView контрол дахь ListViewItem төрлийн
объектуудыг агуулах олонлог. Объект бүр нь тус тусдаа
биеэ даасан пропертуудтай бөгөөд тэдгээрт бусад
жагсаалт контролуудын объектуудад нь хандаж
ажиллах боломжтой.
 SubItems – тухайн элементийн дэд элементүүдийг агуулах
олонлог.
 View - ListView контрол дахь ListViewItem
объектуудын харагдах байдлыг View төрлийн утгаар

 View
 LargeIcon – том дүрснүүдийн дээд талд текст харагдана.

 View
 SmallIcon – жижиг дүрсний баруун талд текст харуулна.

 View
 List – Өмнөө жижиг дүрстэй гарчигууд олон баганад
хуваагдан контролыг дүүргэж харагдана..

 View
 Tile – Том дүрсийн баруун талд текст, түүний дэд
мэдээллүүдийг харуулна.

 View
 Details – Дүрс болон гарчиг эхний баганад, дэд элементүүд
бусад баганад дүрслэгдэнэ.

 View – Details
 Уг контол дахь өгөгдлүүдийг Details хэлбэрээр харуулахаар
сонгосон үед ядаж нэг багана нэмэхгүй бол өгөгдлүүд
дүрслэгдэхгүй.
 Багана нэмэхдээ Columns.Add(key, text, textAlign) метод
ашиглана. Энэ метод нь ColumnHeader объект үүсгэж
ListView контролын Columns олонлогт нэмнэ.
 Details хэлбэрээр харуулахаар сонгосон үед контролын
үзэгдэх байдалд нөлөөлөх бусад шинжүүдийг тодорхойлох
шаардлагатай болно.

 Gridlines – контрол дахь элементүүдийг мөр баганаар
тусгаарласан торлосон зурааснуудыг харуулах эсэхийг
 Sorting – контрол дахь элементүүдийг хэрхэн эрэмбэлэхийг
SortOrder төрлийн утгаар тодорхойлно.
 FullRowSelect – контрол дахь элементийг сонгоход түүний
дэд мэдээллүүд бүтэн мөрөөрөө сонгогдох эсэхийг
 AllowColumnsRecorder – багануудын байрыг сэлгэж болох
эсэхийг тодорхойлно.

 Уг контролд зураг холбохдоо ImageList контролыг
ашиглана. Зургийн хоёр олонлог байх ёстой.
 Том зургийн олонлогийг LargeImageList шинжид
 Жижиг зургийн олонлогийг SmallImageList шинжид
 ListView контрол дахь элемент болох ListViewItem бүрийн
ImageKey эсвэл ImageIndex шинжийг ашиглан өгөгдөл
бүрт тохирох зургийг нь холбож өгнө.

 Жишээ
ImageList img = new ImageList();
img.Images.Add(Image.FromFile(@"D:MyCoursesVisual Programming
ISeminarsФайл зургуудopen.jpg"));
ISeminarsФайл зургуудcut.jpg"));
ISeminarsФайл зургуудpaste.jpg"));
ISeminarsФайл зургуудcopy.png"));
listView1.SmallImageList = img;
listView1.LargeImageList = img;
for (int j = 0; j < img.Images.Count; j++)
{
listView1.Items[j].ImageIndex = j;
}

private void comboBox1_SelectedIndexChanged(object sender, EventArgs e)
{
if (comboBox1.SelectedItem.ToString() == "Details")
{
listView1.Columns.Add("Тоонууд");
listView1.View = View.Details;
}
else if (comboBox1.SelectedItem.ToString() == "LargeIcon")
listView1.View = View.LargeIcon;
else if (comboBox1.SelectedItem.ToString() == "List")
listView1.View = View.List;
else if (comboBox1.SelectedItem.ToString() == "Tile")
listView1.View = View.Tile;
else
listView1.View = View.SmallIcon;
}

DateTimerPicker контрол
 DateTimePicker контрол нь цаг хугацаа, огнооны
мэдээллийг дэлгэцэнд харуулдаг ба тэдгээрээс сонгох
боломжийг хэрэглэгчид олгодог.
 Тайлбар
 Форм дээр хугацааны мэдээлэл агуулсан ComboBox
дүрслэнэ. ComboBox дэлгэцэнд календарийг харуулна.

DateTimerPicker контролын чухал гишүүд
 MaxDate, MinDate – Тухайн контролоос сонгож болох
цаг хугацаа болон огнооны дээд болон доод хязгаарыг
DateTime төрлийн утгаар тодорхойлно, буцаана.
 Value – Тухайн контролын утгыг DateTime төрлийн
утгаар тодорхойлно, буцаана.
 DateTime бүтэц нь тодорхойлсон мэдээлэлтэй ажиллах
гишүүдтэй байдаг.
 Format – тухайн контролд харагдах цаг хугацаа болон
огнооны мэдээллийн хэлбэрийг
DateTimePickerFormat төрлийн утгаар тодорхойлно,
буцаана.

 Format
 Long – уг контрол дээр огнооны мэдээллийг тухайн
үйлдлийн системийн тохиргоогоор бүтэн хэлбэрээр
харуулна.
dateTimePicker1.Format = DateTimePickerFormat.Long;

 Format
 Short – уг контрол дээр огноо мэдээллийг тухайн үйлдлийн
системийн тохиргоогоор товч хэлбэрээр харуулна.
 Time – уг контрол дээр цаг хугацааг үйлдлийн системийн
тохиргооны хэлбэрээр харуулна.

 Format
 Custom – хэрэглэгчийн тодорхойлсон хэлбэр. Хэрвээ энэ
хэлбэрийг сонговол CustomFormat шинжид тохирох утгыг
private void timecontrol_Load(object sender, EventArgs e)
{
dateTimePicker1.Format = DateTimePickerFormat.Custom;
dateTimePicker1.CustomFormat = "MMMM dd, yyy - dddd # HH:mm:ss tt";
}

Формат Тайлбар / CustomFormat /
s, ss Секундыг 1 эсвэл 2 оронтой тоогоор / 0-59 буюу 00-59
m, mm Минутыг 1 эсвэл 2 оронтой тоогоор / 0-59 буюу 00-59
h / hh Цагийг 12 цагийн хэлбэрээр буюу 1 эсвэл 2 оронтой тоогоор / 0-11 буюу 00-11
H / HH Цагийг 24 цагийн хэлбэрээр буюу 1 эсвэл 2 оронтой тоогоор / 00-23 буюу 00-23
t, tt A.M / P.M тэмдэглэгээг 1 буюу 2 үсгээр / (A эсвэл P) буюу (AM эсвэл PM)
d Өдрийг 1 эсвэл 2 оронтой тоогоор /1-31 буюу 01-31
ddd Өдрийг гаригийн эхний 3 үсгээр / Mon-Sun
dddd Өдрийг гаригийн бүтэн нэрээр / Monday-Sunday
M, ММ Сарыг 1 эсвэл 2 оронтой тоогоор / 1-12 буюу 01-12
MMM Сарыг нэрний эхний 3 үсгээр / Jan-Dec
MMMM Сарыг бүтэн нэрээр / January-December
yy Жилийг сүүлчийн 2 оронгоор / 2010 10, 2009 09
yyyy Жилийг бүр оронгоор / 2010, 2009
DateTimerPicker контролын чухал гишүүд - CustomFormat

 Уг контролоос утга сонгох үед харагдах календарын
өнгө загварыг дараах шинжүүдээр өөрчлөх
боломжтой.
 CalendarForeColor
 CalendarFont
 CalendarTitleBackColor
 CalendarTitleForeColor
 CalendarTrailingForeColor
 CalendarMonthBackground

 ValueChanged – уг контролын Value шинжийн утга
өөрчлөгдөх үед буюу сонгогдсон утга өөрчлөгдөх үед
үүсэх үзэгдэл
private void dateTimePicker1_ValueChanged(object sender, EventArgs
e)
{ MessageBox.Show(dateTimePicker1.Value.Date.ToString());
}

ProgressBar контрол
 Аливаа үйл явц дуусахыг хэр хугацаанд хүлээх вэ гэсэн
санааг хэрэглэгчид өгөх үүрэгтэй.
 Тайлбар
 Форм дээр үйл явцын ахиц дэвшлийг харуулах хэвтээ
зурвас дүрслэнэ.

ProgressBar контролын чухал гишүүд
 Style – үйл явцын үргэлжилж буйг харуулах хэлбэрийг
ProgressBarStyle төрлийн утгаар тодорхойлно.
 Blocks – зүүнээс баруун чиглэлд алхамаар нэмэгдэх
сегмент блокууд
 Continuous – зүүнээс баруун чиглэлд дүүргэлт хийх
үргэлжилсэн зурвасууд
 Marquee – хэвтээ чиглэлд хоёр тийш гүйх блокууд

 Minimum, Maximum – тухайн контролын авах утгын
доод болон дээд хязгаарын утгыг тодорхойлно,
буцаана.
 Value – Minimum ба Maximum шинжүүдээр
тодорхойлогдсон хязгаар дахь идэвхитэй утгыг
 Step – PerformStep() методыг дуудах үед тухайн
контролын идэвхитэй утгын нэмэгдэх хэмжээ
 PerformStep() – Идэвхитэй утгыг Step шинжид
тодорхойлсон утгаар нэмэгдүүлнэ.
 Increment() – Идэвхитэй утгыг заасан утгаар
нэмэгдүүлнэ.

 Жишээ

Timer компонент
 Хэрэглэгчийн тодорхойлсон интегралд аливаа үзэгдлийн
хэрэгжүүлэх цаг хугацааны явцыг хангах үүрэгтэй.
 Тайлбар
 Ихэвчлэн бусад конторлтой хамт ашиглагдана.

Timer компонент
 Interval – цагийн хязгаарыг тодорхойлно, буцаана. Уг
контролын Tick үзэгдэл бүрийн хоорондох
милсекундын тоо.
 Милсекунд = секунд / 1000
 Tick() – Interval шинж дэхь хугацаа өнгөрөх бүрт үүсэх
үзэгдэл. Энэ үзэгдэлд Interval шинжид тодорхойлсон
хугацаанд хэрэгжих үйлдлийг кодчилно.
 Enabled – Идэвхитэй байх эсэхийг тодорхойлно.
 Start() – Timer компонентийн ажиллагааг эхлүүлнэ.
 Stop() – Timer компонентийн ажиллагааг зогсооно.

Timer компонентийн чухал гишүүд
Жишээ:
private void Form1_Load(object sender, EventArgs e)
{
timer1.Interval = 50;
progressBar1.Minimum = 0;
progressBar1.Maximum = 100;
progressBar1.Value = 0;
progressBar1.Step = 5;
timer1.Start();
}

Timer компонентийн чухал гишүүд
private void timer1_Tick(object sender, EventArgs e)
{
if(progressBar1.Value <
progressBar1.Maximum)
progressBar1.PerformStep();
else
timer1.Stop();
}
 50/1000 буюу 0.05 секунд тутамд Tick үзэгэл
дуудагдана.
 Tick үзэгдэл 100/5 буюу 20 удаа дуудагдана

NotifyIcon компонент
 NotifyIcon компонент нь програмы интерфейс харагдахгүй
үед тухайн програмын далда үйл явцыг төлөөлөн
програмын мөрний мэдэгдлийн мужид харагдах үүрэгтэй.
 Тайлбар
 Нэг компонент нэг дүрсийг л төлөөлнө.

NotifyIcon компонентийн чухайл гишүүд
 Icon – Мэдэгдийн мужид харагдах дүрсийг
 Text – Дүрсэн дээр хулганы заагч байрлахад гарах
тайлбар текстийг тодорхойлно.
 ContextMenu – Тухайн дүрсэн дээр гарч ирэх контекст
цэсийг тодорхойлно.
 Visible – дүрс харагдах эсэхийг тодорхойлно.
 Doublclick() – дүрс дээр хос даралт хийхэд үүсэх
үзэгдэл

Жишээ:
notifyIcon1.Icon = new Icon(@”D:Iconscheck.ico”);
notify.Icon1.Text = “Жишээ”;
notifyIcon.ContextMenuStrip = contextMenuStrip1;
private void notifyIcon1_DoubleClick(object sender,
EventArgs e)
{
this.Activate();
}

WebBrowser контрол
 WebBrowser контрол нь форм дээр веб хуудаснуудыг
харуулах, тэдгээрийг удирдах боломжийг олгоно.
 Тайлбар
 Энэ контрол нь системийн нөөцийг ихээр шаарддаг.
Тиймээс дараа Dispose() методыг нь ашиглан түүнийг
чөлөөлж байх шаардлагатай.

WebBrowser контролын чухал гишүүд
 Url – идэвхитэй веб хуудасны хаягийг тодорхойлно,
буцаана. URL хаягийг тодорхойлохдоо Url классаар
үүсгэнэ.
 Navigate – тодорхойлсон хаягтай веб хуудсыг ачаалах
метод
 Stop(), Refresh(), GoBack(), GoForward(),
GoHome() – веб хуудсыг удирдах методууд
 Navigating(), Navigate() – өөр веб хуудсыг дуудаж
байх үед, дуудсаны дараа үүсэх үзэгдэл

private void toolStripButton1_Click(object sender,
EventArgs e)
{
webBrowser1.GoBack();
}
EventArgs e)
{
webBrowser1.GoForward();
}

EventArgs e)
{
webBrowser1.GoHome();
}
EventArgs e)
{
webBrowser1.Refresh();
}

10 11

Recommended

Recommended

More Related Content

Viewers also liked

Viewers also liked (17)

More from International Ulaanbaatar University

More from International Ulaanbaatar University (20)

10 11