显示界面：

在main.c文件中，添加如下内容：

#include "fbuf.h"

int main(int argc,char* argv[])
{
	printf(">>>>>>>>>> wlecome to the AicPhoto System <<<<<<<<<<<\n");

	LCD_Init();

	show_Fulljpg("/aicAlbum/gui/login.jpg");
	sleep(5);
	show_Fulljpg("/aicAlbum/gui/menu.jpg");


    while(1);    
    return 0;         

}
 
 
一. 启动进度条

1.1 main.c改造成如下代码

int main(int argc,char* argv[])
{
	printf(">>>>>>>>>> wlecome to the AicPhoto System <<<<<<<<<<<\n");

	LCD_Init();

	show_Fulljpg("/aicAlbum/gui/login.jpg");

	//动手新添加部分代码
	//创建一个子线程
	printf("login system thread begin\n");
	pthread_create(&wel_id,NULL,loginSystem,NULL);			// 显示进度条
	pthread_join(wel_id, NULL);								// 等待进度条显示完毕
	printf("login system thread end\n");

	show_Fulljpg("/aicAlbum/gui/menu.jpg");

    while(1);    
    return 0;         

}

1.2 在ui.c的loginSystem函数中，实现

int x_back,y_back;
int x,y;
int z;
x_back = 212, y_back = 400;
x = 216, y = 404;

int color_2 = 0xa3a3a3;			// 灰色
int color_1 = 0x00ff10;
int i,j;

/*1. 画一个600*30的进度条框*/
int color_heigh = 30,color_weight = 600;
for(i=0;i<color_heigh;i++)
{
	for(j=0;j<color_weight;j++)
	{
		*(mem_p+(y_back+i)*1024+(x_back+j)) = color_2;
	}
}
/*2. 以22*1的小进度条覆盖*/
int color_heigh1 = 22,color_weight1 =1;
for(z = 0;z<592;z++)
{
	for(i = 0;i<color_heigh1;i++)
	{
		for(j=0;j<color_weight1;j++)
		{
			*(mem_p+(y+i)*1024+(x+j)) = color_1;
		}
	}
	x++;
	usleep(10000);
}

调试点：
1. 看下两条打印语句是否打印出来
2. 改变下色调，再看下效果
	int color_2 = 0xa3a3a3;			// 灰色
	int color_1 = 0x00ff10;
3. 改变时间及宽度，看下效果
	usleep(10000);
	color_weight1 =1


二. 实现图片加载显示（小图显示）

1. 在main.c的main函数中添加
int ret;
cur_vidIndex = 0;
pause_target = 0;

//添加显示图片
update_picture();

//新建一个进程
video_id = fork();
if(video_id>0)
{
	// 启动图片循环播放
	ret = pthread_create(&pic_id,NULL,pic_run,NULL);
	if(ret == -1){
		printf("pthread_pic create fail.\n");
		return -1;
	}

}

2.在sort.c的update_picture函数中，添加
char*  update_picture()
{
	pic_max = 0;
	int i = 0;
	DIR *dirp = opendir("/aicAlbum/media/photo");
	struct dirent *entry;
	char *fname = malloc(60);
	while(entry = readdir(dirp)) {
		if (strcmp(entry->d_name, ".") == 0
			|| strcmp(entry->d_name, "..") == 0)
			continue;
		pic_max++;      
		picture = (char *) realloc(picture,60 * pic_max);		// 相当于定义了一个二维数组，并用数组指针指向
	   
		sprintf(fname, "/aicAlbum/media/photo/");
		strcat(fname, entry->d_name);
		if (strlen(fname) > 60) {
			printf("%s name is too long\n", fname);
			continue;
		}
		
		strcpy(picture+i, fname);
		i++;
	}
	int j;

	for(j = 0;j<pic_max;j++)
	{
		printf("picture:%s\n",picture+j);
	}
	free(fname);
	return picture;
}
   

3. 在picture.c中添加pic_run函数
void *pic_run(void *ptr)
{	
	cur_picIndex = 0;
	while(1)
	{
		while(!mode)
		{
			show_jpg_small(picture+cur_picIndex,384, 150);
			cur_picIndex++;
			if(cur_picIndex == pic_max) cur_picIndex=0;
			
			sleep(1);
		}
		usleep(10);
	}

	sleep(1);
	clean();
}

调试点：
1. 调整图片播放的时间间隔为0.5秒
2. 自找几张图片，并且更新到目录中记其播放出来


三、实现小窗口视频播放

1. 在开发板中准备下载好视频文件

#ls /aicAlbum/media/video/

可以看到本目录下有几个视频文件

测试下：
#mplayer /aicAlbum/media/video/1001.mp4 

可以看到有视频画面出来，说明可以利用mplayer播放视频.

使用参数将视频播放到指定区域：
#mplayer -geometry 128:150 -zoom -x 256 -y 150 /aicAlbum/media/video/1001.mp4


2. 在main.c中的main函数中，添加

	......				
	update_video();		// 添加到update_picture();后面一行
	......
	
	
	// 播放视频进程
	if(video_id == 0)
  	{
		printf("[+] player video\n");
		ret = execl("/bin/mplayer","mplayer","-slave","-quiet","-geometry","128:150","-zoom","-x","256", "-y", "150",video+cur_vidIndex,"-loop","0",NULL);       
	}

3. 在sort.c的update_video函数中，添加

char* update_video()
{
    video_max = 0;
    int i = 0;	
    DIR *dirp = opendir("/aicAlbum/media/video");
    struct dirent *entry;
    char *fname = malloc(40);
    while(entry = readdir(dirp)) {
        if (strcmp(entry->d_name, ".") == 0
            || strcmp(entry->d_name, "..") == 0)
            continue;
       
	    video_max++;
		
        video = (char *) realloc(video,60 * video_max);
		
        sprintf(fname, "/aicAlbum/media/video/");
        strcat(fname, entry->d_name);
        if (strlen(fname) > 60) {
            printf("%s name is too long\n", fname);
            continue;
        }

        strcpy(video+i, fname);
		printf("file%d is: %s\n", i, video+i);
        i++;
    }
    int j;
	
    for(j = 0;j<video_max;j++)
    {
        printf("video:%s\n",video+j);
    }
    return video;
}


四、实现系统交互功能

1. 在main.c的main函数中，添加

// 注意添加到pthread_create(&pic_id,NULL,pic_run,NULL);后面

		//启动触摸屏检测	
    	ret = pthread_create(&ts_id,NULL,menu_act,NULL);
        if(ret == -1){
        	printf("pthread_ts create fail.\n");
           	return -1;
      	}

2. 在acting.c的menu_act函数中添加

	//初始化触摸屏
	struct tsdev *ts;
    struct ts_sample samp;
	int ret;
    ts = ts_open(DEV_PATH,0);
    if(NULL == ts){
        printf("ts open fail.\n");
        return (void *)-1;
    }
    ts_config(ts);

	while(1)
    {
		ts_read(ts,&samp,1);
		printf("ts_x: %d, ts_y: %d\n", samp.x, samp.y);


		// auto photo 
		if(samp.y > 450 && samp.pressure == 1)
        {
			printf("------------>　auto photo\n");			
		}

		//manual pic
        if(samp.x > 380 && samp.x < 640 && samp.y <300 && samp.y > 150 && samp.pressure ==1)		
		{
			printf("------------>　manual photo\n");

        }

		//video
        if(samp.x > 128 && samp.x < 384 && samp.y > 150 && samp.y <300 && samp.pressure ==1)	
		{	
			printf("------------>　manual video\n");
        }
	}

调试点：
执行代码后，点击各个区域，看下有什么反应.



五、手动全屏显示图片

1. 在acting.c的menu_act函数中

修改manual pic内容
	//manual pic
	if(samp.x > 380 && samp.x < 640 && samp.y <300 && samp.y > 150 && samp.pressure ==1)		
	{
		//新加内容
		printf("------------>　manual photo\n");
		pthread_t tid;

		mode = 1;
		kill(video_id,SIGSTOP);	
		pthread_create(&tid,NULL,open_pic,NULL);
		pthread_join(tid,NULL);		
		
		mode =0;
		kill(video_id,SIGCONT);
		showMenu("/aicAlbum/gui/menu.jpg");
	}

2. 在picture.c的open_pic函数中，实现

	show_Fulljpg(picture+(cur_picIndex));

	
	struct tsdev *ts;
    struct ts_sample samp;

    ts = ts_open(DEV_PATH,0);
    if(NULL == ts){
        printf("ts open fail.\n");
        return;
    }
    
    ts_config(ts);
	int i=0,k,p,n;
	
	while(1)
    {
		ts_read(ts,&samp,1);

		//退出图片全屏显示
		if(samp.x > 924 && samp.y < 100 && samp.pressure == 1)
		{
			clean();
			ts_close(ts);
			
			pthread_exit(NULL);
		}

		//show prev photo 
		if(samp.x<100 && samp.y>200 && samp.y<300 && samp.pressure == 1)
		{
			printf("prev photo\n");
			cur_picIndex++;
			if(cur_picIndex == pic_max) cur_picIndex=0;
			show_Fulljpg(picture+(cur_picIndex));
		}
		//show next photo 
		if(samp.x>924 && samp.y>200 && samp.y<400 && samp.pressure == 1)
		{
			printf("auto photo\n");

		}
	}

调试点：
1. 上面的代码在测试时，可以看到打开全屏显示的图片与小框上的图片是不一样的
	打开图片是小框上图片的下一张，合理的逻辑应该是打开全屏显示跟小框上是一样的?请修改代码实现
2. 退出全屏显示后，并不是直接显示图片，而是有一会是没有图片显示的，请修正这个bug?
3. 编写代码，实现下一张图片播放功能
	
	

//-----------------------------------------------------------------------------------------------------
参考答案:
1. 在open_pic函数开头中，添加
	if(cur_picIndex == 0)
		cur_picIndex = pic_max-1;
	else 
		cur_picIndex--;
	
2. 将menu_act函数中的showMenu函数调整到kill(video_id,SIGCONT)前面去
	showMenu("/aicAlbum/gui/menu.jpg");
	mode =0;								
	kill(video_id,SIGCONT);	

3. 请参考下一张功能代码，实现上一张图片查询显示
	cur_picIndex--;
	if(cur_picIndex == -1) cur_picIndex=(pic_max-1);
	show_Fulljpg(picture+(cur_picIndex));
//-----------------------------------------------------------------------------------------------------

六、手动全屏播放视频

1. 在acting.c的menu_act函数中

修改manual pic内容

	//video
	if(samp.x > 128 && samp.x < 384 && samp.y > 150 && samp.y <300 && samp.pressure ==1)	
	{	
		printf("touch video ++++++\n");
		pthread_t vtid;
					
		usleep(50000);

		mode = 1;							// pasue photo play
		kill(video_id,SIGKILL);				// quit curent video
		pthread_create(&vtid,NULL,open_video,NULL);
		pthread_join(vtid,NULL);

		mode = 0;							// restart photo play
		showMenu("/aicAlbum/gui/menu.jpg");

		video_id = fork();
		if(video_id == 0)
		{	
			ret = execl("/bin/mplayer","mplayer","-slave","-quiet","-geometry","128:150","-zoom","-x","256", "-y", "150",video+cur_vidIndex,"-loop","0",NULL);    
			{
				if (ret == -1)
				{
					perror("create failed\n");
					exit(1);
				}
			}
		}
	}


2. 在video.c文件的open_video函数中，添加

void *open_video(void *ptr)
{
	printf("open video[****]\n");

	struct tsdev *ts;
    struct ts_sample samp;

    ts = ts_open(DEV_PATH,0);
    if(NULL == ts){
        printf("ts open fail.\n");
        return;
    }
    ts_config(ts);
	
	int ret;
	video_id = fork();
	if(video_id == 0)
	{	
		ret = execl("/bin/mplayer","mplayer","-slave","-quiet","-geometry","0:0","-zoom","-x","1024", "-y", "600",video+cur_vidIndex,"-loop","0",NULL); 
		{
			if (ret == -1)
			{
				perror("create failed\n");
				exit(1);
			}
		}
	}
	
	while(1)
	{
		ts_read(ts,&samp,1);


		// quit video player
		if(samp.x < 100 && samp.y < 100 && samp.pressure == 1)
		{
			clean();
			ts_close(ts);

			kill(video_id,SIGKILL);	
			pthread_exit(NULL);
		}
		
		// pause video play
		if(samp.x > 450 && samp.x < 550 && samp.y > 500 && samp.pressure == 1)
        {
			printf("pause or player video\n");
        }

		//next video player
      	else if(samp.x > 924 && samp.y < 300 && samp.y > 200 && samp.pressure == 1)
        {
			printf("next video player\n");
        }

        //prev video player
        if(samp.x < 100 && samp.y < 300 && samp.y > 200 && samp.pressure == 1)
        {
			printf("prev video player\n");
        }
	}
}

3. 在video.c文件的open_video函数中，添加视频操作

3.1 添加播放/暂停功
	// pause video play
	if(samp.x > 450 && samp.x < 550 && samp.y > 500 && samp.pressure == 1)
	{
		if(pause_target == 0)
		{
			printf("pause video play.\n");
			pause_target = 1;
			kill(video_id,SIGSTOP);
			
		}

		else if(pause_target == 1)
		{
			printf("restart video play.\n");
			pause_target = 0;
			kill(video_id,SIGCONT);
		}	
	}

3.2 添加下一首功能

		//next video player
      	if(samp.x > 924 && samp.y < 300 && samp.y > 200 && samp.pressure == 1)
        {
			cur_vidIndex++;							
			kill(video_id,SIGKILL);				
			if(cur_vidIndex >= video_max) 			
				cur_vidIndex = 0;
			usleep(50000);
			video_id = fork();
			
			if(video_id == 0)
			{
				
				printf("target = %d\n",cur_vidIndex);
				
				ret = execl("/bin/mplayer","mplayer","-slave","-quiet","-geometry","0:0","-zoom","-x","1024", "-y", "600",video+cur_vidIndex,"-loop","0",NULL);
				{
					if (ret == -1)
					{
						perror("create failed\n");
						exit(1);
					}
				}
			}
			wait(video_id);
        }


调试点：
修改代码，实现上一首功能


//参考答案
//prev video player
if(samp.x < 100 && samp.y < 300 && samp.y > 200 && samp.pressure == 1)
{
	cur_vidIndex--;						
	kill(video_id,SIGKILL);
	
	if(cur_vidIndex == -1) 				//濡傛灉target宸茬粡灏忎簬0锛屽氨浠庡熬鎾斁
		cur_vidIndex = video_max;
	usleep(50000);
	video_id = fork();
	
	if(video_id == 0)
	{
		ret = execl("/bin/mplayer","mplayer","-slave","-quiet","-geometry","0:0","-zoom","-x","1024", "-y", "600",video+cur_vidIndex,"-loop","0",NULL);
		{
			if (ret == -1)
			{
				perror("create failed\n");
				exit(1);
			}
		}
	}
	wait(video_id);
}

七：自动播放图片功能

1. 在acting.c文件的menu_act函数中，添加

	//auto pic 
	if(samp.y > 450 && samp.pressure == 1)
	{
		printf("touch auto photo\n");
		
		pthread_t atid;
		
		mode = 1;									// pause photo auto play
		kill(video_id,SIGKILL);						// pause mplayer process
		pthread_create(&atid,NULL,auto_pic,NULL);	
		pthread_join(atid,NULL);					
		mode =0;									// go on photo auto play

		//恢复主界面视频
		video_id = fork();
		if(video_id == 0)
		{	
			ret = execl("/bin/mplayer","mplayer","-slave","-quiet","-geometry","128:150","-zoom","-x","256", "-y", "150",video+cur_vidIndex,"-loop","0",NULL);    
			{
				if (ret == -1)
				{
					perror("create failed\n");
					exit(1);
				}
			}
		} 

		showMenu("/aicAlbum/gui/menu.jpg");	
	}

2. 在picture.c文件auto_pic函数中自动播放图片

/* 自动播放图片 */
int mp3_id, flag;

void *tempPic_eixt(void *ptr)
{
	//设置为可取消
	pthread_setcancelstate(PTHREAD_CANCEL_ENABLE,NULL);
	pthread_setcanceltype(PTHREAD_CANCEL_ASYNCHRONOUS,NULL);

	//循环播放全屏图片
	while(1)
	{
		show_Fulljpg(picture+cur_picIndex);
		cur_picIndex++;
		if(cur_picIndex == pic_max) cur_picIndex=0;
		
		sleep(1);
	}
}

void *auto_pic(void *ptr)
{
	int cnt, ret;
	pthread_t tid;

	struct tsdev *ts;
    struct ts_sample samp;

    ts = ts_open(DEV_PATH,0);
    if(NULL == ts){
        printf("ts open fail.\n");
        return;
    }
    ts_config(ts);

	//创建子线程播放图片
	flag = 0;
	pthread_create(&tid,NULL,tempPic_eixt,NULL);
	
	//检测是否需要退出自动播放模式
	while(1)
	{
		ts_read(ts,&samp,1);
		printf("ts_x: %d, ts_y: %d\n", samp.x, samp.y);
		
		
		if(samp.x > 412 && samp.x < 612 && samp.y <150 && samp.pressure ==1)
		{
			//取消图片播放
			pthread_cancel(tid);

			//主线程退出
			clean();
			ts_close(ts);
			pthread_exit(NULL);
		}		
		usleep(100000);
	}
}

2. 在picture.c文件auto_pic函数中实现背景音乐播放

	//创建循环播放背景音乐进程
	mp3_id = fork();
	if(mp3_id == 0)
	{
		printf("madplayer --------\n");
		
		ret = execl("/usr/bin/madplay","madplay","./media/mp3/002.mp3", NULL);
		if (ret == -1)
		{
			perror("create failed\n");
			exit(1);
		}
	}	

调试点：
编程实现在退出自动图片播放后，背景音乐关闭


参考:
//关闭背景音乐
kill(mp3_id,SIGKILL);