小编Gui*_*ume的帖子

我在我的应用程序中设置了一个 TabView，这样我就可以在多个页面之间水平滑动，但我也有一个可能出现的不需要的垂直滚动，具有反弹效果。如何禁用此垂直滚动？

我的代码：

struct ContentView: View {
  @State private var currentTabIndex: Double = 0

  var body: some View {
    VStack {
      TabView(selection: $currentTabIndex) {
        Text("Text n°1")
          .tag(0)
        
        Text("Text n°2")
          .tag(1)
      }
      .border(Color.black)
      .tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
    }
  }
}

在我的 SwiftUI 应用程序中，每次值更改时我都需要从 ObservedObject 获取数据。我知道我们可以用 .onReceive 做到这一点？我不太了解 Apple 的文档。我不知道我怎么能做到这一点。

我的代码：

import SwiftUI
import CoreLocation

struct Compass: View {
  
  @StateObject var location = LocationManager()
  @State private var angle: CGFloat = 0
  
  var body: some View {
    VStack {
      Image("arrow")
        .resizable()
        .aspectRatio(contentMode: .fit)
        .frame(width: 300, height: 300)
        .modifier(RotationEffect(angle: -CGFloat(self.angle.degreesToRadians)))
        .onReceive(location, perform: {
          withAnimation(.easeInOut(duration: 1.0)) {
            self.angle = self.location.heading
          }
        })
      
      Text(String(self.location.heading.degreesToRadians))
        .font(.system(size: 20))
        .fontWeight(.light)
        .padding(.top, 15)
    }
  }
}

struct RotationEffect: GeometryEffect {
  var angle: CGFloat

  var animatableData: CGFloat {
    get { …

在我的 SwiftUI 应用程序中，我有一个获得全屏高度的 VStack (VStack 1) 容器。在这个 VStack 里面，我有另一个 VStack（VStack 2），它根据它的孩子（文本）获得高度，我想把它放在这个父级（VStack 1）的底部。在 VStack 2 上，我需要放置一个 GeometryReader 来获取 VStack (VStack 2) 的高度。问题是 GeometryReader 自动获得全屏高度。所以VStack 2被放置在屏幕的中间。这不是我想要的。不知道能不能把GeometryReader的高度设置成和VStack 2一样的高度？

我的测试代码：

import SwiftUI

struct ContentView: View {
  var body: some View {
    VStack {
      GeometryReader { geometry in
        VStack {
           Text("Text n°1")
           Text("Text n°2")
           Text("Text n°3")
           Text("Text n°4")
        }
        .border(Color(.red))
      }
      .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: nil, alignment: .bottom)
      .border(Color(.black))
    }
    .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity, alignment: .bottom)
  }
} …

我有一个大小为 80 的文本。当我在此视图上放置边框时，我看到文本上方和下方有额外的空间。为了节省应用程序中的空间，我需要删除此空间。但我不知道这是否可能正确？

代码示例：

import SwiftUI\n\nstruct ContentView: View {\n  var body: some View {\n    Text("360\xc2\xb0")\n      .font(Font.system(size: 80, weight: .thin, design: .default).monospacedDigit())\n      .border(Color.red, width: 2)\n  }\n}\n

结果：

我需要绿色结果：

使用 SwiftUI，我知道如何在整个屏幕上设置一个简单颜色的背景。所以只有后台忽略安全区域。但是当我想用线性渐变来做这件事时，我不知道这样做。

我的观点有一个简单的背景：

import SwiftUI

struct Settings : View {
  var body: some View {
    ScrollView {
        VStack {
          Text("Boussole")
            .color(Color(red: 52/255, green: 73/255, blue: 94/255, opacity: 1.0))
            .multilineTextAlignment(.leading)
            .font(.system(size: 28))
            .padding(.top, 15)
            .frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
          Toggle(isOn: .constant(false)) {
            Text("Afficher le vrai nord")
              .font(.system(size: 20))
              .color(Color(red: 52/255, green: 73/255, blue: 94/255, opacity: 1.0))
          }
          .padding(.top, 10)
          Toggle(isOn: .constant(true)) {
            Text("Activer la vibration")
              .font(.system(size: 20))
              .color(Color(red: 52/255, green: 73/255, blue: 94/255, opacity: 1.0))
          }
          .padding(.top, 10)
          .padding(.bottom, 20) …

我正在swiftUI中创建指南针应用程序。它可以工作，但是当我添加动画来移动指南针时，将出现以下行为：

例如，当它从5°定向转到350°时，它决定进行一次完整的转弯。指南针不是自然行为。

我的ContentView代码：

import SwiftUI
import CoreLocation

struct ContentView: View {

  var locationManager = CLLocationManager()
  @ObservedObject var location: LocationProvider = LocationProvider()
  @State var angle: CGFloat = 0

  var body: some View {
    GeometryReader { geometry in
      VStack {
        Rectangle()
          .frame(width: 10, height: 30)
          .background(Color(.red))
          .foregroundColor(Color(.clear))
        Spacer()
        Text(String(Double(self.location.currentHeading).stringWithoutZeroFraction) + "°")
          .font(.system(size: 40))
          .foregroundColor(Color(.black))
        Spacer()
      }
      .frame(width: 300, height: 300, alignment: .center)
      .border(Color(.black))
      .onReceive(self.location.heading) { heading in
        withAnimation(.easeInOut(duration: 0.2)) {
          self.angle = heading
        }
      }
      .modifier(RotationEffect(angle: self.angle))
    }.background(Color(.white))
  }
}

struct RotationEffect: …

我正在尝试在react项目中运行pixi.js脚本，但由于以下错误而被阻止：

Cannot read property 'appendChild' of null

我不知道为什么会发生此错误。我的脚本必须在div中创建一个canvas元素，以显示具有扭曲效果的图像：http : //guillaumeduclos.fr/ripple-effect/在基本的HTML和JS环境中，它工作得很好。

我的代码：

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import image from './image.png';
import * as PIXI from 'pixi.js'

var width = window.offsetWidth;
var height = window.offsetHeight;
var playground = document.getElementById('pxrender');  
var canvas;
var ratio = 150 / 830;
var count = 0;
var raf;

var renderer = PIXI.autoDetectRenderer(width, height,{transparent:true});
renderer.autoResize = true;
var tp, preview;
var displacementSprite,
    displacementFilter,
    stage;

class App extends …

我需要使用旋转角度对 CGAffineTransform 进行动画处理，但我不知道是否可行，因为 CGAffineTransform 不符合 Animatable。Maby 与“withAnimation”，但我不明白如何使用它。我知道我可以使用rotationEffect，但出于某些原因我必须使用CGAffineTransform。

我的代码：

import SwiftUI
import CoreLocation

struct Arrow: View {

  var locationManager = CLLocationManager()
  @ObservedObject var location: LocationManager = LocationManager()

  private var animationArrow: Animation {
    Animation
      .easeInOut(duration: 0.2)
  }

  var body: some View {
    VStack {
      Image("arrow")
        .resizable()
        .aspectRatio(contentMode: .fit)
        .frame(width: 300, height: 300)
        .transformEffect(
          CGAffineTransform(translationX: -150, y: -150)
            .concatenating(CGAffineTransform(rotationAngle: CGFloat(-location.heading.degreesToRadians)))
            .concatenating(CGAffineTransform(translationX: 150, y: 150))
        )
        .animation(animationArrow)

      Text(String(location.heading.degreesToRadians))
        .font(.system(size: 20))
        .fontWeight(.light)
        .padding(.top, 15)

      Text(String(location.coordinates[0]))
        .font(.system(size: 20))
        .fontWeight(.light)
        .padding(.top, 15)

      Text(String(location.coordinates[1]))
        .font(.system(size: 20))
        .fontWeight(.light)
        .padding(.top, …

对于某些原因，在我的 SwiftUI 应用程序中，我需要使用具有 CGAffineTransform 和 rotationAngle 属性的 transformEffect 修饰符。但结果是这样的：

如何将旋转角度的锚点设置为箭头图像的中心？我在文档中看到我们可以使用CGPoint吗？

我的代码：

import SwiftUI
import CoreLocation

struct Arrow: View {

  var locationManager = CLLocationManager()
  @ObservedObject var heading: LocationManager = LocationManager()

  private var animationArrow: Animation {
    Animation
      .easeInOut(duration: 0.2)
  }

  var body: some View {
    VStack {
      Image("arrow")
        .resizable()
        .aspectRatio(contentMode: .fit)
        .frame(width: 300, height: 300)
        .overlay(RoundedRectangle(cornerRadius: 0)
        .stroke(Color.white, lineWidth: 2))
        .animation(animationArrow)
        .transformEffect(
        CGAffineTransform(rotationAngle: CGFloat(-heading.heading.degreesToRadians))
          .translatedBy(x: 0, y: 0)
        )

      Text(String(heading.heading.degreesToRadians))
        .font(.system(size: 30))
        .fontWeight(.light)
    }
  }
} 

我需要使用 axios 创建一个用于在反应项目中加载 API 的进度条，我发现了“onDownloadProgress”函数。但是我不知道我们是否可以使用它来获取诸如加载百分比之类的信息，还是仅用于文件下载？

所以我不确定我们是否可以通过此功能获取有关 API 加载的信息？

我试图在我的代码中实现这个功能：

componentWillMount() {
  axios.get('https://guillaumeduclos.fr/jd-portfolio/wp-json/wp/v2/posts')
  .then(response => {
    axios.onDownloadProgress = (progressEvent) => {
      let percentCompleted = Math.round( (progressEvent.loaded * 100) / progressEvent.total );
      console.log(percentCompleted);
    }
    this.setState({
      datas: response.data[0].acf.project_illustration.url,
      loading: false
    });
  })
  .catch(error => {
    if(error.response) {
      console.log(error.responderEnd);
    }
  });

}

不显示 console.log()。感谢您的帮助。