Survey
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
User Interface Programming in C#: Model-View-Controller Chris North CS 3724: HCI GUI Topics Components GUI layouts Events Graphics Manipulation Animation Databases MVC Review: Direct Manipulation • DM Definition? (Shneiderman) • • • • • DM processing steps? • 1. • 2. 2 Challenges! • User interface design • Software architecture design Software Architecture so far… Program State -data structures Paint event -display data Interaction events -modify data Model-View-Controller (MVC) Model Program State -data structures View Paint event -display data Controller Interaction events -modify data Model-View-Controller (MVC) UI: refresh View Data display Controller events refresh Data: User input manipulate Model Data model Advantages? • Advantages? • Multiple views for a model • • • • • • • • Multi-view applications (overview+detail, brushing,…) Different users Different UI platforms (mobile, client-side, server-side,…) Alternate designs Multiple models Software re-use of parts Plug-n-play Maintenance Multiple Views View Controller View Controller Model Typical real-world approach View Controller Data display Data manipulation logic Model Data model E.g. C# TreeView Control TreeView control View Controller treeView1.Nodes Java: model listeners Nodes collection Model C# DataBase Controls DataGrid control -scroll, sort, edit, … View Controller DataSet class -tables -columns -rows Model C# DataBase Access (ADO.net) • • OleDB, ODBC, SQLdb, … Steps to get data: 1. 2. 3. 4. • Steps to display data: • • • dbConnection: connect to DB dbCommand: SQL query text dbAdapter: executes query DataSet: resulting data Bind to UI control, DataGrid or Manual data processing Built-in XML support too DB Alternative: DataReader, retrieve data incrementally DB Example • Get data: Using System.Data.OleDb; // “Jet” = MS Access DB driver con = new OleDbConnection("Provider=Microsoft.Jet.OLEDB.4.0;Data Source=c:/mydb.mdb”); cmd = new OleDbCommand("SELECT * FROM mytable”, con); // SQL query adpt = new OleDbDataAdapter(cmd); data = new DataSet( ); adpt.Fill(data); // execute the query and put result in ‘data’ • Display data: dataGrid1.DataSource = data.Tables[0]; // show the table in the grid control MessageBox.Show(data.Tables[0].Rows[0][5].ToString( )); // or process manually, this is row 0 col 5 GUI Topics Components GUI layouts Events Graphics Manipulation Animation Databases MVC