The simplest method is to enable skin replacement for the MVC program.

Source: Internet
Author: User

For WebProgramAchieving skin functions has always been a persistent topic.

The implementation method is nothing more than using the template engine to parse the template of the skin to generate a page.

The template engine is also diverse and strange.

However, I think the razor built-in in MVC is the best template engine in terms of experience with Visual Studio.

MVC view Parsing is actually a kind of template parsing behavior. Can we use MVC view parsing to realize the program skin replacement function? In this way, you do not need to parse templates.

The following is an example of skin replacement.

First, implement a common MVC program, and then repair it into an MVC program with skin switch.

Create an empty mvc3 project.

Implement indexaction under homecontroller and provide some data.

Public Actionresult index ()
{
Viewbag. Title = " Welcome to blog " ;
Ilist < String > News = New List < String > (){
" An example of system performance optimization " ,
" Cowboy source code analysis (5) " ,
" Exception caused by using the app_code folder in ASP. NET web application " ,
" Android custom components-topmenu " ,
" Use CSS and jquery to simulate a hyperlink user Click Event "
};
Viewbag. News = News;

ReturnView ();
}
}

 

Create an indexaction view and display the data provided by the action.

< H1 >
@ Viewbag. Title
</ H1 >

<Ul>
@ Foreach (string STR in viewbag. News)
{
<Li>@ Str</Li>
}
</Ul>

 

Project Structure

Project running result:

By now, a common MVC program is finished. Next we will implement the skin replacement function.

 

Modify the _ viewstart. cshtml file as follows.

@{
Layout = " Shared/_ layout. cshtml " ;
}

 

Create a new skins directory under the view directory to store skin files.

Create two skin directories under the skins Directory, which are green and red. Copy all the files in the original view directory except web. config to these two directories.

Then add different styles to the _ layout. cshtml of the two skins respectively.

Red makeup plain _ layout. cshtml

 

<Style type = "text/CSS">
*
{
Color : Red ;
}
</Style>

 

Green _ layout. cshtml

<Style type = "text/CSS">
*
{
Color : Green ;
}
</Style>

 

In this case, an error is returned when running the project, prompting that the view file cannot be found.

Next we will modify the view search path to switch the template.
Modify the global. asax file.

Protected Void Application_start ()
{
Arearegistration. registerallareas ();

Registerglobalfilters (globalfilters. filters );
Registerroutes (routetable. routes );

Regskin ( " Green " ); // Skin name change
}
Public Static Void Regskin ( String Skinname)
{
Razorviewengine engine = viewengines. Engines. Where (E => E Is Razorviewengine). Single () As Razorviewengine;
Engine. viewlocationformats = engine. partialviewlocationformats = engine. masterlocationformats = New String [] {
" ~ /Views/skins/ " + Skinname + " /{1}/{0}. cshtml " ,
" ~ /Views/skins/ " + Skinname + " /{1}/{0}. vbhtml " ,
" ~ /Views/skins/ " + Skinname + " /{1}/shared/{0}. cshtml " ,
" ~ /Views/skins/ " + Skinname + " /{1}/shared/{0}. vbhtml " ,
" ~ /Views/{1}/{0}. cshtml " ,
" ~ /Views/{1}/{0}. vbhtml " ,
" ~ /Views/shared/{0}. cshtml " ,
" ~ /Views/shared/{0}. vbhtml "
};
}

 

So far, the skin replacement function has been completed.


 

 

 

Click here to download the demo

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.