wsl下xwindow圖形開發

1、wsl連上X服務器

不需安裝桌面只需裝xterm測試一下：

sudo apt install xterm

在win10裏裝Xming安裝時一路默認就能夠了，最好還有Xming-fonts（要在同一目錄），我安裝的是Xming-6-9-0-31-setup.exe+Xming-fonts-7-5-0-47-setup.exe，在天翼雲中有共享

啓動Xming，即可以在wsl中執行xterm

DISPLAY=:0 xterm

爲了方便，設置DISPLAY環境變量

在~/.bashrc 增長

export DISPLAY=:0

這樣直接從此執行圖形界面的程序都會鏈接到Xming。

2、安裝一些圖形庫

Xlib/Xt/Motif等：

sudo apt install libxt-dev libmotif-dev libxext-dev  libxaw7-dev libxmu-dev

opengl：

sudo apt-get install libgl1-mesa-dev freeglut3-dev libglu1-mesa-dev

 gtk/gtk+開發
 

sudo apt install libgtk-3-dev libgtk2.0-dev

fltk 開發

sudo apt install libfltk1.3-dev

3、例子fltk 中使用opengl

準備須要的文件。 CubeView.cxx  main.cxx Makefile.FLTK CubeView.h CubeViewUI.cxx CubeViewUI.h Makefile。除了 main.cxx文件其他的在/usr/share/doc/fltk1.3-doc/examples/目錄下拷貝便可。

main.cxx

#include "CubeViewUI.h"
#include <FL/Fl.H>

int main(int argc, char **argv) {
// 定義類CubeViewUI的一個實例
CubeViewUI *cvui=new CubeViewUI;
// 設置FLTK窗口顯示模式
Fl::visual(FL_DOUBLE|FL_INDEX);
cvui->show(argc,argv);

// 進入消息循環
return Fl::run();
}

還須要一些改動：

1:在CubeView.h註釋掉#include <config.h> ，改成 //#include <config.h>

2:Makefile.FLTK

#
# Stuff every FLTK application might need
#
#    If you take this for use in your own project, be sure to change
#    the 'FLTKCONFIG' setting to point to where it's installed
#    on your system. Common examples:
#
#       FLTKCONFIG = /usr/local/bin/fltk-config
#       FLTKCONFIG = /usr/local/src/fltk-1.3.x-svn/fltk-config
#
#    Set .SILENT in your Makefile if you want 'quieter' builds.


FLTKCONFIG   = /usr/bin/fltk-config
CXX          = $(shell $(FLTKCONFIG) --cxx)
CXXFLAGS     = $(shell $(FLTKCONFIG) --cxxflags) -Wall -I.
LINKFLTK     = $(shell $(FLTKCONFIG) --ldstaticflags)
LINKFLTK_GL  = $(shell $(FLTKCONFIG) --use-gl --ldstaticflags)
LINKFLTK_IMG = $(shell $(FLTKCONFIG) --use-images --ldstaticflags)
LINKFLTK_ALL = $(shell $(FLTKCONFIG) --use-images --use-gl --ldstaticflags)
.SUFFIXES: .C .cpp .cxx .h .fl .o

3：Makefile

include Makefile.FLTK

RM    = rm -f
SHELL = /bin/bash
.SILENT:
#==============================================================
# This program's object code files
PRG     =       myFltkGl1


OBJS    =       main.o  CubeView.o CubeViewUI.o

#==============================================================
# Executables
all:    $(PRG)

# TO LINK
$(PRG): $(OBJS)
        @echo "*** Linking $@..."
        $(CXX) -o $@ $(OBJS) $(LINKFLTK_GL)
# clean everything
clean:
        $(RM) $(PRG)
        $(RM) *.o
        $(RM) core

make後就產生myFltkGl1

運行截圖：

opencv:

在wsl安裝opencv開發庫：

sudo apt-get install libopencv-dev

代碼：

#include <opencv2/opencv.hpp>    
#include<iostream>  
using namespace cv;  
int main()  
{  

     IplImage *img = cvLoadImage("./lena.jpg");
    cvNamedWindow ("Source", 1);
    cvShowImage ("Source", img);

    cvWaitKey(0);
    cvReleaseImage(&img);
    return 0;
}

編譯

g++  lena.cpp -o lena `pkg-config --libs --cflags opencv`

隨便下個圖命名爲lena.jpg

運行截圖：

視頻播放playvideo.cpp：

#include <opencv2/opencv.hpp>
using namespace cv;

int main(){
    VideoCapture capture("1.mp4");

    while (true) {
        Mat frame;
        Mat edge;
        capture >> frame;
        if (frame.empty())
            break;

        cvtColor(frame, edge, COLOR_BGR2GRAY);
        blur(edge, edge, Size(7,7));
        Canny(edge, edge, 10, 30);

        imshow("Video", frame);
        imshow("After canny", edge);

        //等待50ms，若是從鍵盤輸入的是q、Q、或者是Esc鍵，則退出
        int key = waitKey(50);
        if (key == 'q' || key == 'Q' || key == 27)
            break;
    }

    return 0;
}

編譯：

g++ playvideo.cpp -o playvideo `pkg-config --libs --cflags opencv`

要找個視頻文件如1.mp4文件放在當前目錄，運行截圖：

進度條控制代碼：playvideo1.cpp 

#include <opencv2/opencv.hpp>
#include <iostream>

using namespace std;
using namespace cv;

int g_slider_position=0;

CvCapture* g_capture=NULL;
void onTrackbarSlider(int,void*){
	cvSetCaptureProperty(g_capture,CV_CAP_PROP_POS_FRAMES,g_slider_position);
}
int main(){
	//play vedio

	cvNamedWindow("play vedio");
	g_capture=cvCreateFileCapture("1.mp4");

	int frames=(int)cvGetCaptureProperty(g_capture,CV_CAP_PROP_FRAME_COUNT);
	if(frames!=0){
		createTrackbar("進度","play vedio",&g_slider_position,frames,onTrackbarSlider);
	}
	IplImage* frame;
	while(1){
		frame=cvQueryFrame(g_capture);
		g_slider_position=(int)cvGetCaptureProperty(g_capture,CV_CAP_PROP_POS_FRAMES);
		setTrackbarPos("進度","play vedio",g_slider_position);
		if(!frame) break;
		cvShowImage("play vedio",frame);
		if((char)cvWaitKey(33)==27) break;
	}
	cvReleaseCapture(&g_capture);
	cvDestroyWindow("play vedio");
	return 0;
}

運行截圖：