OSX Maverick / iOS style panel
-
Hi there.
I'm trying to figure out how to create a transparent/blurry panel as found in recent versions of OSX/iOS.
I've come with a solution, but the result is kinda crappy (see here for details: http://deadbird.fr/?p=800):
!http://i1.wp.com/deadbird.fr/wp-content/uploads/2013/11/shot5.png(iOS blur)!
Can someone enlighten me? Mays be is there a way to redefine QDialog's paint event and achieve such effect?
-
You can use the native NSVisualEffectView:
@Dialog::Dialog(QWidget *parent) : QDialog(parent), ui(new Ui::Dialog)
{
ui->setupUi(this);this->setWindowFlags( Qt::FramelessWindowHint ); this->setAttribute( Qt::WA_TranslucentBackground ); // native window dragging, smoother than handling mouseMoveEvent NSView *view = (NSView *)window()->winId(); NSWindow *wnd = [view window]; [wnd setMovableByWindowBackground:YES]; // setup the native vibrancy effect auto v = [[NSVisualEffectView alloc] init]; v.material = NSVisualEffectMaterialDark; v.blendingMode = NSVisualEffectBlendingModeBehindWindow; v.state = NSVisualEffectStateFollowsWindowActiveState; auto mv = new QMacCocoaViewContainer( v ); layout()->addWidget( mv ); [v release]; this->show();
}
@But this requires OS X 10.10.
-
Awesome, can't wait to try it! Btw, I can't find the headers to include to make NS stuff accessible, can you help me again?
Thanks a lot ;)
-
Just #import <AppKit/AppKit.h>. It needs to be in a .mm files, and you will need to use the 10.10 sdk.
So in the .pro file:
OBJECTIVE_SOURCES += dialog.mm
QMAKE_MAC_SDK = macosx10.10I got it to work by modifying your sample project.
-
I can't get it to work, I still have errors. I started from a simple application, with this:
@#include "dialog.h"
#include "ui_dialog.h"#import <AppKit/AppKit.h>
#include <QMacCocoaViewContainer>
#include <QLayout>Dialog::Dialog(QWidget *parent) :
QDialog(parent),
ui(new Ui::Dialog)
{
ui->setupUi(this);
this->setWindowFlags( Qt::FramelessWindowHint );
this->setAttribute( Qt::WA_TranslucentBackground );// native window dragging, smoother than handling mouseMoveEvent NSView *view = (NSView *)window()->winId(); NSWindow *wnd = [view window]; [wnd setMovableByWindowBackground:YES]; // setup the native vibrancy effect auto v = [[NSVisualEffectView alloc] init]; v.material = NSVisualEffectMaterialDark; v.blendingMode = NSVisualEffectBlendingModeBehindWindow; v.state = NSVisualEffectStateFollowsWindowActiveState; auto mv = new QMacCocoaViewContainer( v ); layout()->addWidget( mv ); [v release]; this->show();
}
Dialog::~Dialog()
{
delete ui;
}@@#ifndef DIALOG_H
#define DIALOG_H#include <QDialog>
namespace Ui {
class Dialog;
}class Dialog : public QDialog
{
Q_OBJECTpublic:
explicit Dialog(QWidget *parent = 0);
~Dialog();private:
Ui::Dialog *ui;
};#endif // DIALOG_H@
@#-------------------------------------------------
Project created by QtCreator 2015-02-17T10:23:44
#-------------------------------------------------
QT += core gui
greaterThan(QT_MAJOR_VERSION, 4): QT += widgets
TARGET = testblur
TEMPLATE = appSOURCES += main.cpp
HEADERS += dialog.h
FORMS += dialog.ui
QMAKE_MAC_SDK = macosx10.10
QMAKE_CXXFLAGS += -std=c++11
LIBS += -framework FoundationOBJECTIVE_SOURCES +=
dialog.mm@ -
The error:
Undefined symbols for architecture x86_64:
"OBJC_CLASS$_NSVisualEffectView", referenced from:
objc-class-ref in dialog.o
ld: symbol(s) not found for architecture x86_64
clang: error: linker command failed with exit code 1 (use -v to see invocation)
make: *** [testblur.app/Contents/MacOS/testblur] Error 1
11:41:10: The process "/usr/bin/make" exited with code 2.
Error while building/deploying project testblur (kit: Desktop Qt 5.4.0 clang 64bit)
When executing step "Make" -
LIBS += -framework AppKit
I think.
-
Did it, instant crash on layout()->addWidget( mv );
:'(
Can you send me a simple project that works for you?
My email: deadbird99 at gmail dot com
Thanks ;)
-
did you delete the layout from the ui file ? (layout() == nullptr)
I'm using Qt 5.4.0. I'll send the project later...