AnchorPane круглые углы javafx [дубликат]
Что вы должны знать о this
this (иначе говоря, «контекст») - это специальное ключевое слово внутри каждой функции, и его значение зависит только от того, как была вызвана функция, а не как / когда / где он был определен. Лексические области не затрагиваются, как и другие переменные. Вот несколько примеров:
function foo() {
console.log(this);
}
// normal function call
foo(); // `this` will refer to `window`
// as object method
var obj = {bar: foo};
obj.bar(); // `this` will refer to `obj`
// as constructor function
new foo(); // `this` will refer to an object that inherits from `foo.prototype`
Чтобы узнать больше о this, посмотрите документацию MDN.
Как обратиться к correct this
Не использовать this
Вы действительно не хотите получать доступ к this в частности, но как . Вот почему простое решение - просто создать новую переменную, которая также относится к этому объекту. Эта переменная может иметь любое имя, но обычными являются self и that.
function MyConstructor(data, transport) {
this.data = data;
var self = this;
transport.on('data', function() {
alert(self.data);
});
}
Поскольку self является нормальной переменной, она подчиняется лексическим правилам области и доступна внутри обратного вызова. Это также имеет то преимущество, что вы можете получить доступ к значению this самого обратного вызова.
Явно установить this обратного вызова - часть 1
. Может показаться, что у вас есть не контролируйте значение this, потому что его значение устанавливается автоматически, но на самом деле это не так.
Каждая функция имеет метод документа MDN , который возвращает новую функцию с this, привязанную к значению. Функция имеет то же поведение, что и тот, который вы назвали .bind, только то, что this было установлено вами. Независимо от того, как и когда эта функция вызывается, this всегда будет ссылаться на переданное значение.
function MyConstructor(data, transport) {
this.data = data;
var boundFunction = (function() { // parenthesis are not necessary
alert(this.data); // but might improve readability
}).bind(this); // <- here we are calling `.bind()`
transport.on('data', boundFunction);
}
В этом случае мы привязываем обратный вызов this к значению MyConstructor 'this.
Примечание. При связывании контекста для jQuery вместо этого используйте jQuery.proxy [docs]. Причина этого заключается в том, что вам не нужно сохранять ссылку на функцию при отмене обратного вызова события. jQuery обрабатывает это внутренне.
ECMAScript 6: Используйте функции стрелок
В ECMAScript 6 представлены функции стрелок, которые можно рассматривать как лямбда-функции. У них нет собственной привязки this. Вместо этого this просматривается в области видимости как обычная переменная. Это означает, что вам не нужно называть .bind. Это не единственное особое поведение, которое у них есть. Дополнительную информацию см. В документации MDN.
function MyConstructor(data, transport) {
this.data = data;
transport.on('data', () => alert(this.data));
}
Установите this обратного вызова - часть 2
Некоторые функции / методы, которые принимают обратные вызовы, также принимают значение, к которому должен обращаться обратный вызов this. Это в основном то же самое, что и привязывать его самостоятельно, но функция / метод делает это за вас. jQuery.proxy [docs] - такой метод. Его подпись:
array.map(callback[, thisArg])
Первым аргументом является обратный вызов, а второй аргумент - значение this. Вот надуманный пример:
var arr = [1, 2, 3];
var obj = {multiplier: 42};
var new_arr = arr.map(function(v) {
return v * this.multiplier;
}, obj); // <- here we are passing `obj` as second argument
Примечание: Если вы можете передать значение для this, обычно упоминается в документации к этой функции / методу. Например, метод $.ajax jQuery [docs] описывает параметр, называемый context:
Этот объект станет контекстом всех обратных вызовов, связанных с Ajax.Общая проблема: использование объектных методов в качестве обработчиков обратных вызовов / событий
Другим распространенным проявлением этой проблемы является то, что объектный метод используется как обработчик обратного вызова / события , Функции являются первоклассными гражданами в JavaScript, а термин «метод» - просто разговорный термин для функции, которая является значением свойства объекта. Но эта функция не имеет конкретной ссылки на ее «содержащий» объект.
Рассмотрим следующий пример:
function Foo() {
this.data = 42,
document.body.onclick = this.method;
}
Foo.prototype.method = function() {
console.log(this.data);
};
Функция this.method назначается как обработчик события click , но если щелкнуть document.body, зарегистрированное значение будет undefined, потому что внутри обработчика события this ссылается на document.body, а не на экземпляр Foo. Как уже упоминалось в начале, то, что относится к [49], зависит от того, как называется функция, а не от того, как она определена. Если код выглядит следующим образом, может быть более очевидным, что функция не имеет неявной ссылки на объект:
function method() {
console.log(this.data);
}
function Foo() {
this.data = 42,
document.body.onclick = this.method;
}
Foo.prototype.method = method;
, называемый , такой же, как указано выше: если доступно, используйте .bind, чтобы явно привязать this к определенному значению
document.body.onclick = this.method.bind(this);
или явно вызвать функцию как «метод» объекта, используя анонимную функцию в качестве обратного вызова / event и присвоить объект (this) другой переменной:
var self = this;
document.body.onclick = function() {
self.method();
};
или использовать функцию стрелки:
document.body.onclick = () => this.method();
2 ответа
Для modena.css (определение внешнего вида JavaFX по умолчанию в Java 8) для всех элементов управления (а также для панелей, если элемент управления загружен) был введен небольшой затененный фон.
Вы можете удалить это, указав, что фон по умолчанию прозрачен. Это можно сделать, добавив следующую строку в файл CSS вашего приложения:
.root { -fx-background-color: transparent; }
Это в дополнение к другим настройкам, которые у вас уже есть в коде, чтобы инициализировать стиль сцены и фоновое заполнение сцена.
stage.initStyle(StageStyle.TRANSPARENT);
scene.setFill(Color.TRANSPARENT);
Примечание: в примере кода вопроса создается дополнительный этап (initStage) вместо использования пройденного этапа для метода запуска. Прошедший этап может быть инициализирован, использован и показан непосредственно вашим кодом, а не создает дополнительный initStage.
stage.initStyle(StageStyle.TRANSPARENT); это для скрытия верхней панели (свернуть, восстановить и закрыть)
scene.setFill(Color.TRANSPARENT); это для цвета рамки (вы можете заменить TRANSPARENT на любой цвет ЗЕЛЕНЫЙ ЖЕЛТЫЙ КРАСНЫЙ ГОЛУБОЙ ...), но для меня я хочу видеть стекло, если вы можете понять меня, и с другим цветом, поэтому решение
primaryStage.setOpacity(0.2);
число 0,2 находится между 0 и 1 0 скрыт и 1 является нормальной формой, но между цифрами прозрачными, поэтому выберите свой номер и запустите свою программу и посмотрите, действительно ли это то, что вы хотите, для этого полного кода
primaryStage.setFullScreen(true);<br>
и в файле css сделайте это
.root { -fx-background-color:rgba(0,0,0,1); }<br>
, и вы можете изменить цвет с измененным номером в rgba (0,0,0,1)