java 任务栏高亮_在Java中创建横幅/工具栏,就像Windows任务栏一样

本文介绍了如何在Java中利用JWindow或Modal、un_decorated JDialog来创建一个类似Windows任务栏高亮效果的横幅或工具栏。通过示例代码展示了如何动态改变窗口宽度,实现窗口从无到有平滑滑入视图的过程。

其中一种方法是使用JWindow或Modal和un_decorated JDialog,例如

import java.awt.BorderLayout;

import java.awt.event.ActionListener;

import java.awt.event.ActionEvent;

import javax.swing.JLabel;

import javax.swing.JPanel;

import javax.swing.JWindow;

import javax.swing.SwingUtilities;

import javax.swing.Timer;

public class SlideText_1 {

public static void main(String[] args) {

SwingUtilities.invokeLater(new Runnable() {

@Override

public void run() {

createAndShowGUI();

}

});

}

private static void createAndShowGUI() {

final JWindow window = new JWindow();

final JPanel windowContents = new JPanel();

JLabel label = new JLabel("A window that is pushed into view..........");

windowContents.add(label);

window.add(windowContents);

window.pack();

window.setLocationRelativeTo(null);

final int desiredWidth = window.getWidth();

window.getContentPane().setLayout(null);

window.setSize(0, window.getHeight());

window.setVisible(true);

Timer timer = new Timer(15, new ActionListener() {

@Override

public void actionPerformed(ActionEvent e) {

int newWidth = Math.min(window.getWidth() + 1, desiredWidth);

window.setSize(newWidth, window.getHeight());

windowContents.setLocation(newWidth - desiredWidth, 0);

if (newWidth >= desiredWidth) {

((Timer) e.getSource()).stop();

window.getContentPane().setLayout(new BorderLayout()); //restore original layout

window.validate();

window.setVisible(false);

}

}

});

timer.start();

}

private SlideText_1() {

}

}

(1)任务描述 洛洲汽车用品有限公司秉承专业铸就品牌、细节决定成败的经营思路,以一流的产品一流的服务使我们的客户得到专业的服务。秉承“诚信为本,服务至上”的经营宗旨,德宝以优质的产品,合理的价位、精湛的技术、一流的服务,诚信经营,开拓了汽车美容装饰、汽车音响专业改装领域的广阔市场,赢得了广大客户的支持与信任,现已代理多家国际国内知名汽车用品品牌。 现公司决定建设一个企业网站来树立企业形象,加强产品的宣传,扩大公司的知名度,打造自己的品牌。公司网站项目命名为“洛洲汽车用品有限公司”网,网站是公司信息化门户,通过公司网站的建设,可以很好地向外界宣传洛洲汽车用品有限公司,更好地展示公司的产品。公司网站将公司的产品展现给公众,让更多的人员知道公司的产品,更多的公众选择公司的产品,更多的客户享受到公司的产品。 经过前期需求调研,网站项目组组长对公司网站项目已经进行项目需求分析,将本网站项目的前端页面分成七个模块,分别是首页、公司概况、产品频道、新闻中心、合作加盟、人力资源、联系我们等。你作为《洛洲汽车用品有限公司》网站项目开发组的成员,请采用相应的网页开发工具软件来完成实现以下相关工作任务: l “新闻中心”页面的页面布局 l “新闻中心”页面的静态页面设计 l “新闻中心”页面的交互式实现 (2)任务要求 任务一:项目创建与资源整合(10分) 具体要求: l 创建答题文件夹:创建以“考生号-模块号-题号”命名的文件夹,存放所有答题文件,例如:“340103-4-14”; l 创建vue脚手架项目,项目名称:Vue_考生号_题号; l 导入Web项目素材(assets文件夹下的素材复制到vue项目assets下,IMG文件夹复制到vue项目的public下); l 引入web项目所需的css文件; 提交要求: l 请在web开发工具的项目管理器窗口中截取创建的web项目图片,截取之前请展开public、src文件夹,使这两个文件夹下的文件清晰可见,提交至答卷1-1截图位置。 任务二:创建组件(15分) 利用index.html的内容,将页面内容按要求合理划分组件,应用组件组成页面,参考如面网页布局图。 1.png 图1 布局图 具体要求: 1)将顶部class="header "的div划分为Top组件; 2)将class="menu"的div划分为Nav组件; 2)将id="banner"的div划分为Banner组件; 3)将class="bottom"划分为Footer组件。 4)所有的组件文件放置在components文件中。 5)注意,请将对应的css文件中的样式表复制到对应的组件文件中。 6)在App.vue中应用组件制作框架页面。 提交要求: l 在展开components文件夹展开截图,提交至答卷2-1截图位置。 l 请将4个组件进行截图(截取HTML和script部分),提交至答卷2-2截图位置。 l 请将App.vue文件中HTML和script代码截图,提交至答卷2-3截图位置。 任务三、创建路由页面(15分) 打开项目中的index.html文件,将class="main"的div部分创建成为路由页面index.vue。打开product.html文件,将class="main"的div部分创建成为路由页面product.vue。所有路由页面均放置在pages文件夹下: 2.png 图2 效果图 提交要求: l 在展开pages文件夹展开截图,提交至答卷3-1截图位置。 l 将每个路由页面文件中的HTML和script代码截图,提交至答卷3-2截图位置。 任务四、实现路由效果(25分) 3.png 图3 页面广告幻灯片效果 具体要求: l 安装路由插件npm i vue-router@3.2.0。 l 创建router文件夹,在router文件夹中创建index.js文件,并写代码创建路由器对象; l 在main.js文件中注册路由器对象; l 在Nav.vue文件中应用路由器<router-link>和<router-view>; l 调整路由器选择后的状态样式。 提交要求: l 请截取以上的路由器效果图,提交至答卷4-1截图位置。 l 请截图安装路由器过程,提交至答卷4-2截图位置。 l 请截取创建路由器对象代码,提交至答卷4-3截图位置。 l 请截图注册路由器对象代码,提交至答卷4-4截图位置。 l 请截图应用路由器代码,提交至答卷4-5位置。 任务五、调用外部JSON文件,实现交互式网页(25分) 1)运用相关的文本工具查看JSON数据文件carnews.json,JSON文件的内容及格式如下图所示: 4.png 具体要求:请查看JSON文件,查找出与“热点聚焦”相关的六条数据。 提交要求:对查找到的数据进行截图,提交至答卷5-1截图位置。 2)运用axios技术,调用外部JSON数据carnews.json文件,实现交互式网页编写。例如点击左边栏元素“行业动态”,右边栏目内容根据点击的文本,显示出“行业动态”相关的新闻列表。具体效果图如下图所示,注意红色标红的区域为数据变化的区域。 5.png 图4 交互式网页效果 具体要求: l 为左侧的导航项ul标签中li元素添加鼠标单击事件。 l 鼠标点击事件要求根据点击标签的内容,右侧产品列表栏目的标题显示点击标签的文本内容,调用外部JSON数据文件,新闻列表栏目页中显示TITLE元素对应的新闻标题,新闻发布时间TIME元素的值靠右显示。具体点击事件的相关活动图如下图所示: 6.png 图5 活动图 提交要求: l 请截取点击“热点聚焦”标签后,右侧新闻列表显示JSON文件中的“热点聚焦”数据相关新闻的效果图,提交至答卷5-2截图位置。 l 请截取点击“最新公告”标签后,右侧新闻列表显示JSON文件中的“最新公告”数据相关新闻的效果图,提交至答卷5-3截图位置。 l 请截取news.vue文件代码中,应用axios的相关代码图片。提交至答卷5-4截图位置。 l 请截取news.vue文件中,循环显示json数据的html代码。提交至答卷5-5截图位置。
最新发布
10-23
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值