源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

Symfony2框架创建项目与模板设置实例详解

  • 时间:2020-07-18 18:52 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:Symfony2框架创建项目与模板设置实例详解
本文实例讲述了Symfony2框架创建项目与模板设置的方法。分享给大家供大家参考,具体如下: [b]环境准备与概览[/b] 习惯于在windows使用netbean编辑器并使用virtualbox虚拟centos系统, 预将nginx+php-fpm+mysql,  当然apache也是不错的选择,   使用http://symfony在windows与centos上作为开发域名。 [b]一、下载与环境设置[/b] 1. 如何于centos上面建立开发环境不再详述, 当然也可以在windows上面建立开发环境。 2. 关于使用 symfony代替127.0.0.1 在liunx系统中修改/etc/hosts文件, win7系统中修改 C:\Windows\System32\drivers\etc\host 文件(需要用管理员权限打开) 加入类似于IP 别名1 别名2的内容即可, 如:
[url=http://fonts.googleapis.com/css?family=Irish+Grover]
上面代码在引入了一个js文件, 在ie9版本前的浏览器中实现html, 以及两个css文件导入google fronts. 这构成了网页的主要内容结构, 相当于drupal的html.tpl.php+page.tpl.php. 让我们看一下头部文件 {% 标签中即不是html, 也不是php, 他是3个Twig标签中的一个, 用于执行某些动作。 这里可以找到完整的Twig控制动作用于这个标签。 回到当前代码, 是用于查找title的block并输出他, 如果没有则输出默认的symblo这个词。 Twig的可续承特性可以用于修改title, 我们可以在其它模板文件中重写它: {% extends '::base.html.twig' %} {% block title %}The blog title goes here{% endblock %} 上面代码首先继承了第一次定义这个block的文件, 然后修改它。 网站标题部分会输出 'The blog title goes here – symfony'。 一般而言, 我们引用模板文件时会采用bundle:controller:template, 但是以上代码并没有bundle 和controller, 不包含这两个字段会直接引用app/Resources/views/ 文件夹下面的文件。 在css样式表中, 我们可以发现另一个Twig标签{{, 这是一个输出(说些什么)标签。
[url={{ asset(] 这个标签用于输出变量或者表达式, 上面例子输出了asset函数的返回值, 这个函数提供可移植的方式来返回css,js, 图片的地址。 这个标签可以以特定格式输出我们想要内容, 比如时间: 全部过滤列表在 Twig 文档可以查到。 最后一个标签并没有在上述代码中出现, 它是{#, 只是一个注释标签
[u]复制代码[/u] 代码如下:
{# 注释内容可以输出在这里 #}
接下来我们将创建css样式表web/css/screen.css , 加入以下内容.
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}
body { line-height: 1;font-family: Arial, Helvetica, sans-serif;font-size: 12px; width: 100%; height: 100%; color: #000; font-size: 14px; }
.clear { clear: both; }
#wrapper { margin: 10px auto; width: 1000px; }
#wrapper a { text-decoration: none; color: #F48A00; }
#wrapper span.highlight { color: #F48A00; }
#header { border-bottom: 1px solid #ccc; margin-bottom: 20px; }
#header .top { border-bottom: 1px solid #ccc; margin-bottom: 10px; }
#header ul.navigation { list-style: none; text-align: right; }
#header .navigation li { display: inline }
#header .navigation li a { display: inline-block; padding: 10px 15px; border-left: 1px solid #ccc; }
#header h2 { font-family: 'Irish Grover', cursive; font-size: 92px; text-align: center; line-height: 110px; }
#header h2 a { color: #000; }
#header h3 { text-align: center; font-family: 'La Belle Aurore', cursive; font-size: 24px; margin-bottom: 20px; font-weight: normal; }
.main-col { width: 700px; display: inline-block; float: left; border-right: 1px solid #ccc; padding: 20px; margin-bottom: 20px; }
.sidebar { width: 239px; padding: 10px; display: inline-block; }
.main-col a { color: #F48A00; }
.main-col h1,
.main-col h2
{ line-height: 1.2em; font-size: 32px; margin-bottom: 10px; font-weight: normal; color: #F48A00; }
.main-col p { line-height: 1.5em; margin-bottom: 20px; }
#footer { border-top: 1px solid #ccc; clear: both; text-align: center; padding: 10px; color: #aaa; }

[b]Bundler模板–level 2[/b] 现在我们为blog bundler 创建模板, 创建src/Blogger/BlogBundle/Resources/views/layout.html.twig 并加入:
[u]复制代码[/u] 代码如下:
{# src/Blogger/BlogBundle/Resources/views/layout.html.twig #} {% extends '::base.html.twig' %} {% block sidebar %} Sidebar content {% endblock %}
非常简单的代码,1. 继承了一级模板, 并且为博客内容特别定制了侧边栏, 很显然我们并不想博客的布局与其它页面一样。 类似drupal7中page–content-type.tpl.php模板, 定制了某一特殊类型内容的布局。 具体页面布局–level 3 这个阶段已经涉及到创建具体页面, 所以需要先创建控制器src/Blogger/BlogBundle/Controller/PageController.php
// src/Blogger/BlogBundle/Controller/PageController.php
namespace Blogger\BlogBundle\Controller;
use Symfony\Bundle\FrameworkBundle\Controller\Controller;
class PageController extends Controller
{
public function indexAction()
{
return $this->render('BloggerBlogBundle:Page:index.html.twig');
}
}

然后创建相应的Twig文件: src/Blogger/BlogBundle/Resources/views/Page/index.html.twig
[u]复制代码[/u] 代码如下:
{# src/Blogger/BlogBundle/Resources/views/Page/index.html.twig #} {% extends 'BloggerBlogBundle::layout.html.twig' %} {% block body %} Blog homepage {% endblock %}
创建路由将首页引导到我们刚创建的页面:src/Blogger/BlogBundle/Resources/config/routing.yml
[u]复制代码[/u] 代码如下:
# src/Blogger/BlogBundle/Resources/config/routing.yml BloggerBlogBundle_homepage: pattern: / defaults: { _controller: BloggerBlogBundle:Page:index } requirements: _method: GET
再次访问 http://symfony/app_dev.php可以看见简单的首页。 [img]http://files.jb51.net/file_images/article/201603/2016317115044670.jpg?2016217115054[/img] [b]四、再创建一个about页面[/b] 路由:在src/Blogger/BlogBundle/Resources/config/routing.yml中加入
[u]复制代码[/u] 代码如下:
# src/Blogger/BlogBundle/Resources/config/routing.yml BloggerBlogBundle_about: pattern:  /about defaults: { _controller: BloggerBlogBundle:Page:about } requirements: _method:  GET
当以get方式访问about页时执行位于BloggerBlogBundle命名空间的page控制器about动作。 控制器: 在src/Blogger/BlogBundle/Controller/PageController.php 于page控制器中加入about动作
[u]复制代码[/u] 代码如下:
// src/Blogger/BlogBundle/Controller/PageController.php // .. public function aboutAction() { return $this->render('BloggerBlogBundle:Page:about.html.twig'); } // ..
模板: 创建src/Blogger/BlogBundle/Resources/views/Page/about.html.twig 并加入相关页面文件
[u]复制代码[/u] 代码如下:
{# src/Blogger/BlogBundle/Resources/views/Page/about.html.twig #} {% extends 'BloggerBlogBundle::layout.html.twig' %} {% block body %} about page {% endblock %}
简单的三个流程增加了关于页面:http://symfony/app_dev.php/about 希望本文所述对大家基于Symfony框架的PHP程序设计有所帮助。
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部