asp.net-mvc 有没有 ASP.NET MVC 的图形设计器？

Is there any graphical designer for ASP.NET MVC?

提问by CiccioMiami

I guess that most people that use Visual Studio had my same reaction when they created their first ASP.NET MVC project: where did the Design Viewend up?

我想大多数使用 Visual Studio 的人在创建他们的第一个 ASP.NET MVC 项目时都有同样的反应：设计视图在哪里结束？

When using classic Web Forms to develop an application in Visual Studio, the Design Viewis really handy, it helps you to create user controls and other components in your webpage by simply drag and dropping the item from the toolbox to the design page. Although it does not allow positioning and advanced styling, as Dreamweaver does instead, it is a really useful feature if you want to avoid painful HTML formatting and CSS styling (or you do not have good knowledge of HTML).

当使用经典的 Web 窗体在 Visual Studio 中开发应用程序时，设计视图非常方便，它可以帮助您在网页中创建用户控件和其他组件，只需将项目从工具箱拖放到设计页面即可。尽管它不允许定位和高级样式，但正如 Dreamweaver 所允许的那样，如果您想避免痛苦的 HTML 格式和 CSS 样式（或者您对 HTML 没有很好的了解），它是一个非常有用的功能。

Is there any way to use a graphic designer to create the View layout and then integrate the design with the "logic" part of the View (the one that uses the model to populate/submit the data from/to the controller)?

有什么方法可以使用图形设计器来创建视图布局，然后将设计与视图的“逻辑”部分（使用模型从/向控制器填充/提交数据的那个部分）集成？

采纳答案by Darin Dimitrov

I guess that most people that use Visual Studio had my same reaction when they created their first ASP.NET MVC project: where did the Design View end up?

我想大多数使用 Visual Studio 的人在创建他们的第一个 ASP.NET MVC 项目时都有同样的反应：设计视图在哪里结束？

Not at all. Personally I never used the design view in classic web forms and when I migrated to MVC it didn't really make any difference. And not only this, it doesn't make any sense to use it anymore. I am very happy that there is no designer messing with my code anymore. I have enough headaches with Intellisense, if you use a designer which touches the code behind the scenes things will get messy. All I need is working Intellisense which completes the tags and ideally understands HTML5.

一点也不。就我个人而言，我从未在经典 Web 表单中使用过设计视图，当我迁移到 MVC 时，它并没有真正产生任何区别。不仅如此，再使用它也没有任何意义。我很高兴没有设计师再弄乱我的代码了。我对 Intellisense 已经够头疼了，如果你使用一个接触幕后代码的设计师，事情会变得一团糟。我所需要的只是完成标签并理想地理解 HTML5 的智能感知。

As far as designing web pages is concerned you may take a look at the Expression tools.

就设计网页而言，您可以查看表达式工具。

回答by toddmo

Yes, I had that same reaction, coming from a webforms background. I need the constant feedback of a graphical designer to let me know what effect my code is having. Learning MVC is a big enough learning curve in and of itself without having to do it blindfolded.

是的，我有同样的反应，来自网络表单背景。我需要图形设计师不断的反馈，让我知道我的代码有什么效果。学习 MVC 本身就是一个足够大的学习曲线，而不必蒙着眼睛。

Now that it's 4 years later, I don't mind saying Page Inspector is built in to VS 2013. If you're still using VS 2010 in 2015, all I can say is, if you upgrade, you'll never look back.

现在已经过去了 4 年，我不介意说 Page Inspector 内置于 VS 2013。如果您在 2015 年仍在使用 VS 2010，我只能说，如果您升级，您将永远不会回头。

Just right click on the code and choose View in Page Inspector. There's an Inspectbutton in the inspector that you can use to see where an element of the design is located in the code. It can save you beaucoup time.

只需右键单击代码并选择在页面检查器中查看。检查器中有一个检查按钮，您可以使用它来查看设计元素在代码中的位置。它可以节省您的美容时间。

EDIT

编辑

And it looks like they removed it from Visual Studio 2015 and didn't even bother to post an explanation as to why. Smh...I'll update this if I find a 3rd party solution.

看起来他们从 Visual Studio 2015 中删除了它，甚至懒得张贴解释原因。Smh...如果我找到第 3 方解决方案，我会更新这个。

回答by GraemeMiller

I think they are working on that as a feature for Expression Blend 5 Developer Preview.

我认为他们正在努力将其作为Expression Blend 5 Developer Preview 的一项功能 。

They clearly recognise the issue of designing JS in the designer so I suspect they realise the same applies to some designers working on MVC applications.

他们清楚地认识到在设计器中设计 JS 的问题，所以我怀疑他们意识到这同样适用于一些设计 MVC 应用程序的设计师。

I was told by someone from Microsoft "I think in Blend for HTML, using interactive mode, you would probably be just fine with designing MVC or MVVM patterns"

微软的某个人告诉我“我认为在 Blend for HTML 中，使用交互模式，你可能会很好地设计 MVC 或 MVVM 模式”

Also check out Visual Studio Page Inspectorit looks like it will do what is needed

还要查看Visual Studio Page Inspector看起来它会做需要的事情

Now use WebEssentials with BrowserLinkin VS2013 or up

现在在 VS2013 或更高版本中使用 WebEssentials 和BrowserLink

回答by Venkatesh Muniyandi

If you are looking for designer to get instant feedback of the HTML/cshtml changes, this can be achieved by BrowserLink feature in Visual Studio. Fire the browser and hit the page/view you are currently designing and when you make any changes to the mark up/cshtml, hit the refresh button within Visual Studio, updates made to the code will be immediately pushed to browser.

如果您正在寻找设计器以获取 HTML/cshtml 更改的即时反馈，这可以通过 Visual Studio 中的 BrowserLink 功能实现。启动浏览器并点击您当前正在设计的页面/视图，当您对标记/cshtml 进行任何更改时，点击 Visual Studio 中的刷新按钮，对代码所做的更新将立即推送到浏览器。

Other alternate is to use Chrome Developer tools (F12) and using "Edit as Html" feature.

其他替代方法是使用 Chrome 开发人员工具 (F12) 并使用“编辑为 Html”功能。

I know these alternates are not rich as native designer view support in Visual Studio, but these are some practical workarounds.

我知道这些替代品在 Visual Studio 中并不像原生设计器视图支持那样丰富，但这些是一些实用的解决方法。