Sunday, 31 January 2016

Publishing a Visual Studio Project on GitHub

   GitHub is a version control system that used to work across the shared projects. You can also use it to put your project on cloud , so you'll never worried about its sequential backups. GitHub will save your all project versions before and after changing.
   Microsoft is providing GitHub Extension for visual studio. You can download and install it from here . I'm going to show you in this blog post that how to make a project in visual studio and publish it to GitHub .
I'm writing this with Snapshots so that you can easily understand what I'm going. I'm writing it with Steps. please put your comments as feedback because I'm very new to writing blog.
  1. Open Visual Studio and Select the option " Open from Source Control " .this option used to create a project on Some Version Control System. Like GitHub or TFS etc. TFS stands for Team Foundation Server.

  2.   After selecting "Open from Source Control"  a small window named " Team Explorer - Connect " will open. List of projects under the tab of GitHub will be showing in that window.

  3. After Selecting your project type and name you've to focus on a small check box on bottom right corner "Add to Source Control". by default this is check box is not checked. you've to check it to Put your project on GitHub. After that click OK.

  4. You'll be shown another small window like below . you've to choose your version control system from Provided options. Select Git and click OK.
          a) Team Foundation Version Control is Microsoft's Version Control system that is               also very famous. 

    5. After this you'll be shown two types of repositories
               a) Online repositories
              b) Local repositories
        Under local repositories , the project you just created will be visible.
     6.  To sync your local project with online GitHub click on Clone. VS will ask for the URL of online repository. It is that repository which you've already created on GitHub website. If you did't create it yet. Simply open GitHub and create your account.


    7. Open your GitHub account. you'll find few option over there.



    8.  Click to Create New Repository.
        your already created repositories will be shown here also.



    9. Once your click new repository . You'll be provided a form to fill with some information.
            a) Repository name > set a name for your repository to access it from web using URL like
               " Owner / Repository name "
            b) Write a description for your repository.



    10 .  You'll find two buttons Public and Private
                   a) Public:
                           
    Anyone can see and access your project.
                   b) Private:
                           You've option to set the access level of your project.
                   c) Initialize this repository with a README:
                         
      If you check it . a copy of online repository will be sync to your desktop                                     immediately. So leave it UnCheck and click Create Repository.
     11. Your repository has been created . Copy the URL of your repository as shown in picture             below.



     12
    . Now come back to your visual studio and paste the URL of your repository and click "Clone". Your local project will be sync to your online repository.


    13. In case to publish your repository . Just paste the URL of online repository and click Publish.


    14. You can see your synced repository online by clicking "View" as given in below picture.

Wednesday, 27 January 2016

Static Resources in XAML ( Universal Windows Platform , Windows 10 Applications )

Static resources are defined inside the application cdoe and they are available to the controls as "static source of design" which means they defined on compile time by the programmer and cannot be changed on run time. On the other hand "Dynamic Resources" can be change on runt time.
   To elaborate a static resource lets make a simple application in UWP. UWP stands for Universal Windows Platform which has been introduced in Windows 10 application development.
 
    Open visual studio and make a windows 10 Universal app as shown in figure.
 
 
 
Open your MainPage.xaml from Solution Explorer and go to the XAML code behind XAML Designer.

 
  Now we're going to add a button in side the Default Grid view. In order to add two buttons use following code.
  1. <Button Content="Click Me 1" Margin="119,191,0,417" ></Button>  
  2. <Button Content="Click Me 2" Margin="119,267,0,341" ></Button>  
   Its time to add a static resource for these buttons. use following see the following code and snapshot.

  1. <Page.Resources>  
  2.     <Style TargetType="Button" >  
  3.         <Setter Property="Background" Value="Red"></Setter>  
  4.         <Setter Property="Foreground" Value="White"></Setter>  
  5.     </Style>  
  6. </Page.Resources>  
After inserting the code for resource your buttons will look like ..

 
There are few properties and XAML objects ( tags ) that needs explanation.

  • Property TargetType asks us the Control type that we're going to design using this resource.
    In this case we're applying our resource on button. you can also apply it any control that accept
    resources.
  • In the tag of Setter we are using two properties
    1. Property = "Background"
        This feature asks us to write the the property that we're going to apply on controls. In our case we're going to apply
        background color on buttons , so we write background.
    2. Value = "Red"     once you write the property that will be applied to controls you've to mention its value as well. In this case I just mentioned it with "Red" color.
  • You might noticed that the styles that we've set for the buttons is applying to all the button that we're using on current scope of project. If you want to apply resources on specific controls you can use Controls with their names.
  • If you have any problem just put your comments below the post. I'll respond you their.

Friday, 22 January 2016

Type Converter in XAML

In this , I'm going to show you how XAML Works in background and makes UI designing very easy for us .
we're going to discuss about Automatic Type converters in XAML.

whenever you make some control in XAML you set its properties. For example in following screen shot we are making a button in XAML and setting its properties like
  • Name 
  • Horizontal Alignment
  • Margin
  • Background
  • Vertical Alignment                 
  • Horizontal Alignment
  • and
  • Background Color
    etc , you are shown a list of given option through Intellisense like below.
      
  • So you have limited options as shown in above screenshot. you've to select 1 position from 4 given options . These options are infect enums.




have you ever noticed that when you type in for setting the properties like ,
Now I'm going to show you the alternate way to set properties using C# syntax. To make a button from C# write following code in Page Load Event in program.

when you make a control from C# code. You've to set all of its properties in code. In this case we've set its
  • HorizontalAlignment
    and
  • Background
 properties. You selected the background color and Horizontal Alignment from a strongly typed enumeration for the button. So the question is ! How these properties are mapped to strongly typed enumeration, when you type a string which is "left" in the case of alignment property and "Red" in case of color selection.
Answer is ! XAML parser does this job.
   XAML parser convert string value into a strongly typed version of that value.
so when you set the properties like < horizontalAllignment = "Left" >  , the string "Left" will be mapped to the strongly typed enum by the XAML parser.

Adding a Page Load event in XAML ( Window Store Apps )

We've worked a lot on windows forms applications in C#.net .
Page load event automatically added into the form.cs file when you double click anywhere on your form in windows form application. But this is not the case in UWP Applications. UWP stands for Universal Windows platform. XAML apps does't provide you the event handler for the page when you double clicks anywhere on your page in XAML apps.
    So in order to add a page load event in XAML Apps. Make a UWP Project from Visual Studio. To make a project , open visual studio and select new project as given below,
  • Select "Universal" from left side.
  • choose "Blank App ( Universal Windows )". and press enter.



Open MainPage.xaml from Solution explorer. Main page with visual design will be displayed.
type an event in opening tag of "Page" named " Loaded " just like below screenshot. An event handler for the page loading will be added to .cs file behind the UI page.


Take your cursor on the name of event which is "Page_Loaded" here and press F12 , you'll be redirected to the event handler in code page.
see the screen shot of event below.


This is page load event. Do whatever you want. Have fun coding..post in comments if your got some query.